@charset "utf-8";
/* CSS Document */

html {
    background: none;
}
* {
    text-shadow: none !important;
}
body {
    font-size: 90%;
    width: auto;
    -webkit-text-size-adjust: none;
    background-color: #fff;
    line-height: 1.4em;
}

@media screen and (max-width: 830px) {
    .pc {
        display: none;
    }
    .tb {
        display: block;
    }
    .mb {
        display: none;
    }
}

@media screen and (max-width: 700px) {
    .pc {
        display: none;
    }
    .tb {
        display: none;
    }
    .mb {
        display: block;
    }
}
/*********************************************************************************外枠たち*/
#Wrapper {
    width: auto;
    margin: 0 auto -60px;
    min-height: 100%;
    height: auto !important;
}

@media screen and (max-width: 900px) {
    .menu_contents .box_x3 > div img {
        max-width: 250px;
    }
    .result_contents, .prize_contents, .tips_contents, .youkou_contents,  .oubo_contents, .software_contents, .gallery_contents {
        padding: 20px;
    }
    .result_contents {
        padding-top: 20px;
    }
    .result_contents.kasaku{
        padding-bottom:30px;
    }
    .bt_download,  .bt_more {
        height: 48px;
        line-height: 44px;
    }
    .bt_as_ps {
        height: 48px;
        padding: 4px 0;
    }
}

@media screen and (max-width: 700px) {
    .result_contents, .prize_contents, .tips_contents, .youkou_contents,  .oubo_contents, .software_contents, .gallery_contents {
        padding: 10px;
    }
    .result_contents.kasaku{
        padding-bottom:20px;
    }
}

@media screen and (max-width: 520px) {
    .menu_contents .box_x3 > div img {
        width: 150px;
    }
    .result_contents.silver .result_about > div.image img,  .result_contents.blue .result_about > div.image img {
        padding: 0 10px;
    }
    .result_about > div.text {
        padding-left: 0;
        font-size: 90%;
        line-height: 1.25em;
    }
    .result_contents.silver .result_about > div.text,  .result_contents.blue .result_about > div.text {
        font-size: 90%;
        line-height: 1.25em;
    }
}

/*********************************************************************************メインビジュアル*/
@media screen and (max-width: 700px) {
 .visual_layout {
  display: flex;
  flex-direction: column;
  padding-top: 15px;
 }
 .bxslider img {
  width: 150%;
 }
 .theme_m {
  width: 35%;
  margin-right: 65%;
  order: 0;
 }
 .logo {
  width: 100%;
  order: 1;
  margin: 0 auto;
 }
 .logo h1 img,
 .theme_m img {
  padding: 0;
 }
 .logo .questionnaire{
  display:block;
 }
 .theme_m .questionnaire{
  display:none;
 }
 .bx-viewport {
  max-height: 1000px;
 }
 .bx-viewport {
  padding-bottom: 28%;
 }
 #Visual {
  height: 960px;/*1117追加*/
 }
}

@media screen and (max-width: 650px) {
 #Visual {
  height: 885px;/*1117追加*/
 }
}

@media screen and (max-width: 630px) {
 #Visual {
  height: 850px;/*1117追加*/
 }
}

@media screen and (max-width: 600px) {
 .bx-viewport {
  padding-bottom: 27%;
 }

 #Visual {
  height: 805px;/*1117追加*/
 }

}

@media screen and (max-width: 580px) {
 #Visual {
  height: 770px;/*1117追加*/
 }
}

@media screen and (max-width: 550px) {
 #Visual {
  height: 730px;/*1117追加*/
 }
}

@media screen and (max-width: 530px) {
 #Visual {
  height: 720px;/*1117追加*/
 }
}

@media screen and (max-width: 510px) {
 .bx-viewport {
  padding-bottom: 26%;
 }
 #Visual {
  height: 670px;/*1117追加*/
 }
}

@media screen and (max-width: 480px) {
 #Visual {
  height: 621px;/*1117追加*/
 }
}

@media screen and (max-width: 450px) {
 #Visual {
  height: 585px/*1117追加*/
 }
}
@media screen and (max-width: 440px) {
 #Visual {
  height:590px;/*1117追加*/
 }
}
@media screen and (max-width: 430px) {
 #Visual {
  height:550px;/*1117追加*/
 }
}

@media screen and (max-width: 400px) {
 .bx-viewport {
  padding-bottom: 25%;
 }

 #Visual {
  height: 511px;/*1117追加*/
 }
}

@media screen and (max-width: 380px) {
 #Visual {
  height: 488px/*1117追加*/
 }
}

@media screen and (max-width: 370px) {
 #Visual {
  height: 472px; /*1117追加*/
 }
}


@media screen and (max-width: 350px) {
 #Visual {
  height: 431px/*1117追加*/
 }
}

@media screen and (max-width: 320px) {
 .bx-viewport {
  padding-bottom: 20%;
 }

 #Visual {
  height: 406px;/*1117追加*/
 }
}
/*********************************************************************************アンケート導線*/
@media screen and (max-width: 700px) {
 .questionnaire_contents {
  display: block;
 }

 .questionnaire_contents .bt_questionnaire {
  background-color: #cf2b55;
  padding: 5px 5px;
  box-sizing: border-box;
 }
 .questionnaire_contents .bt_questionnaire a {
  border: none;
  padding: 0px;
 }
 .questionnaire_contents .bt_questionnaire span.icon {
  width: 36px;
  padding: 5px;
 }
 .questionnaire_contents .bt_questionnaire span.text {
  color: #fff !important;
  font-size: 100%;
  line-height:1.32em;
  font-weight: 700;
  padding: 5px;
 }
}
@media screen and (max-width: 480px) {
 .questionnaire_contents .bt_questionnaire a span.text {
  font-size:95%;
  line-height:1.32em;
 }
}
/*********************************************************************************グロナビ*/
@media screen and (max-width: 900px) {
 .menu_contents nav > div {
  width: 33.3%;
  padding: 5px 0;
 }
 .menu_contents nav > div img {
  width: 120%;
 }
}

 @media screen and (max-width: 700px) {
  .menu_contents nav > div {
   width: 48%;
   height:auto;
  }
  .menu_contents nav > div img {
   width: 70%;
  }
 }

 @media screen and (max-width: 520px) {
  .menu_contents nav > div img {
   width: 100%;
  }
  .menu_contents {
   padding: 10px 10px 10px 10px;
  }
 }

 /*********************************************************************************section*/
.prize_contents .comment h4{
 font-size:18px;
}
.prize_contents .button .bt_apple{
 font-size:18px;
 padding:10px;
}
.googleicon::before{
 width:25px;
 height:22px;  }

 @media screen and (max-width: 800px) {
  .collabo_info .button {
   display:block;
  }
  .collabo_info .button .bt_apple {
   width: 100%;
  }
 }

 @media screen and (max-width: 700px) {
  .box_x2 {
   display: block;
  }
  .box_x2 > div {
   width: 100%;
  }
  h2 {
   font-size: 135%;
   margin: 0 0 25px 0;
  }

  .download_box{
   padding:16px;
    border-radius:16px;
 }
  .nurie .box_x2 {
   display: -webkit-flex;
   display: flex;
  }
  .nurie .box_x2 > div {
   width: 48%;
  }


  .tips_box {
   padding: 16px;
   margin-bottom: 16px;
   border-radius: 16px;
  }
  .gallery_waku {
   border-radius: 16px;
   padding: 16px;
  }
  .gallery_box{
   border-radius: 16px;
   padding: 16px;
  }

  /*今回の塗りマス！は*/
  .collabo_contents {
   padding: 20px 10px;
  }
  .collabo_contents >div {
   border-radius: 16px;
   padding: 16px;
  }
  .collabo_contents h2{
  margin-top:10px;
   margin-bottom:15px;
  }
  .collabo_info {
   display: block;
  }
  .collabo_info > div:first-child {
   width: 100%;
   margin-bottom: 20px;
  }
  .collabo_info > div:nth-child(2) {
   width: 100%;
  }
  .collabo_info > div:nth-child(2) img {
   width: 80%;
   display: block;
   margin: 0 auto 10px auto;
  }
  .collabo_info img{
   width: auto;
   max-height:204px;
  }
  .collabo_info .comment{
   margin-bottom: 0px;
  }

  /*賞品*/
  .prize_box {
   padding: 0px 16px;
   border-radius: 16px;
  }
  .prize_box h4 {
   border-radius: 0;
   position:static;
   margin-bottom:10px;
   text-align:center;
  }
  .prize_box h4 img {
   width:100%;
   max-width:381px;
   max-height:none;
   margin:0 auto;
  }
  .prize_box_white {
   padding: 10px 10px;
   margin-bottom: 16px;
   border-radius: 10px;
  }
  .prize_box_white .name,
  .prize_box_white.name{
   font-size:100%;
  }
  .prize_box_white .right,
  .prize_box_white.right{
   padding-left:0;
   text-align:left;
  }

  .prize_box_white .box_x2 > div > div {
   padding: 5px;
   border-radius: 10px;
  }
  #Software .box_x2 >div {
   margin-bottom: 30px;
  }
 }

 @media screen and (max-width: 480px) {
/*セクション共通*/
  .result_contents h2 img, .prize_contents h2 img, .tips_contents h2 img, .youkou_contents h2 img, .oubo_contents h2 img, .software_contents h2 img, .gallery_contents h2 img {
   max-height:40px;
  }

  /*今回の塗りマス！は*/
  .collabo_contents h2{
   margin-top:5px;
   margin-bottom:10px;
  }
  .collabo_info img{
   max-height: 150px;
  }
  .collabo_info > div:first-child{
   margin-bottom:10px;
  }


 }

 /*********************************************************************************リンク*/

 a:active, a:active span {
  color: #333 !important;
 }
 /*********************************************************************************リスト*/
 a.list_headerimage {
  background-position: left 2px !important;/****上書き*/
 }
 ul.ui-listview li {
  background-image: none !important;
  padding-left: 0 !important;
 }
 ul.list_type02 li {
  font-size: 120%;/****上書き*/
  margin-right: 30px;/****上書き*/
 }
 /*********************************************************************************ボタン*/
 .box_twitter a {
  margin: 0;
 }
 .box_twitter a img {
  width: 100%;
 }
 .box_twitter h4 {
  line-height: 1.3em;
 }

@media screen and (max-width: 480px) {
 .bt_questionnaire a{
  padding:0 7px;
 }
 .bt_questionnaire a span.icon {
  padding:0 7px;
 }
 .bt_questionnaire a span.text {
  font-size:95%;
  line-height:1.32em;
  padding:5px 7px;
 }
}
 /*********************************************************************************テーブル*/
 td, th {
  white-space: normal !important;
  display: block;
 }
 .cell_base {
  width: auto;
 }
 table.layout_table tr td, table.layout_table tr th {
  padding: 1px 0 !important;
 }
 .youkou_contents th {
  font-size: 110%;
  padding: 5px 10px;
 }
 .youkou_contents td {
  font-size: 90%;
  line-height: 1.4em;
 }
 .youkou_contents td, .youkou_contents th {
  border-width: 0 0px 2px 0px;
 }
 .youkou_contents td:last-child {
  border-bottom: none;
 }

 /*-------------------------結果発表*/
 @media screen and (max-width: 700px) {
    .result_about .image img {
        width: 80%;
    }
    .ALLcommtnt {
        padding: 20px;
    }

  .result_title img{
        width: 100%;
  }
  blockquote{
        font-size: 100%;
        padding: 10px;
        background-size: 20%;
  }
  #Result .box_x1 .contents_img{
   max-width:80%;
  }
  .gallery_x2{
   display:block;
   /*max-width: 800px;
   flex-wrap: wrap;
   margin: 0 auto;
   justify-content: space-between*/
  }
  .gallery_x2 >div{
   width:80%;
   margin: 0 auto 20px auto;
   /*display:flex ;
   flex-direction: column;*/
  }
  .grid {
   column-count: 2;
  }

 }