@charset "UTF-8"; @import"https://fonts.googleapis.com/css?family=Noto+Sans+JP:300,400,500,600,700&subset=japanese&font-display+swap"; /* reset */
html, body, h1, h2, h3, h4, h5, h6, ul, ol, dl, li, dt, dd, p { margin: 0; padding: 0; font-size: 100%; }
html { font-size: 62.5%; -ms-touch-action: manipulation; touch-action: manipulation; }
body { font-size: 1.4rem; font-weight: 400; -webkit-font-kerning: auto; font-kerning: auto; letter-spacing: .04em; text-rendering: optimizeLegibility; line-height: 2; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; font-family: 'Lucida Sans Unicode', 'Lucida Grande', メイリオ, meirio, 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', 'ＭＳ Ｐゴシック', 'MS PGothic', Verdana, sans-serif; }
@media(min-width:30em) { 
  body { font-size: 1.5rem; }
}
@media(min-width:48em) {
  body { font-size: 1.6rem; background: #FFF; }
}
a { color: #000;}
a:hover, button:hover ,img:hover { transition: all .3s ease-in-out; }
img { border: 0; virtical-align: bottom; line-height: 0; display: block;}
button { background-color: transparent; border: none; cursor: pointer; outline: none; padding: 0; appearance: none; }
ul, ol { list-style: none; }
input,textarea { -webkit-appearance: none; border-radius: 0; }
::placeholder { color: #CCC; }
* html .clearfix { height: 1px; }

#wrap { width: 100%; overflow: hidden; line-height: 2; }
#page_top {position: fixed; bottom: 85px; right: 20px; z-index: 999;  background: rgb(47 108 171); color: #fff; text-align: center; text-decoration: none; width: 30px; height: 30px; }
#page_top:hover { background: rgb(244 93 131 / 50%); text-decoration: none; }
.view_pc,.view_sp {display: none;}

/* top */
header { } 
.logo_area { display: flex; padding: 10px 0; }
.logo_area div { width: 50%; }
.logo_area div img { display: block; margin: 5px 0; }
.logo_area div:nth-child(1) { border-right: 1px solid #FFF; }
.tokuho_area { background: #fff3f5; color: #f85c83; display: flex; }
.tokuho_area div:nth-child(1) { width: 85%; font-size: 10px; line-height: 1.5;  padding: 10px 0 10px 5px; }
.tokuho_area div:nth-child(2) { width: 15%; }
.fixed_top { position: fixed; top: 0; left:0; width: 100%; z-index: 999; transition: all .2s ease-in-out; }

/* FV */
.FV_wrap { background: #ebebeb;  position: relative; }
.campaign_obj_posi_1 { position: absolute; width: 100%; bottom:29%; left: 0; z-index: 1; }
.campaign_obj_posi_2 { position: absolute; width: 100%; bottom:6%; left: 0; z-index: 1; }
.campaign_obj_posi_3 { position: absolute; width: 100%; bottom:3%; left: 0;  z-index: 1; }
/* cont-1 */
.cont-1 {  background:  url("../images/bg_1.jpg") repeat; background-size: 100%; position: relative; }
.campaign_obj_posi_4 { position: absolute; width: 100%; top:5%; left: 0; z-index: 1; }
.campaign_obj_posi_5 { position: absolute; width: 100%; top:10%; left: 0; z-index: 1; }
.campaign_obj_posi_6 { position: absolute; width: 100%; top:55%; left: 0;  z-index: 1; }
.campaign_obj_posi_7 { position: absolute; width: 100%; bottom:10%; left: 0;  z-index: 1; }
/* cont-2 */
.cont-2 { background:  url("../images/bg_2.jpg") repeat; background-size: 100%; padding-bottom: 45px; }
.cont-2 h1 { margin: -45px 0 0 0; }
.step_wrap li { position: relative; margin: 25px 0; }
.step_wrap li:last-child { margin: 25px 0 0 0; }
.campaign_obj_posi_8 { position: absolute; width: 100%; top:5%; left: 0; z-index: 1; }
/* cont-3 */
.cont-3 {}
.cont-3 h1 { margin: -45px 0 0 0; }
.creator_list::after { content:""; display: block; clear: both; }
.creator_list li { float: left; width: 50%; padding: 25px; }
.creator_list button { position: relative; }
.creator_list button::after { content:""; position: absolute; top:25%; left: 25%; opacity:.2; }
.creator_list a { color: #000; }
.img_wrap { background: none; border: none; padding: 0; width: 100%; margin: 0 auto; overflow: hidden; }
.img_wrap img { width: 100%; cursor: pointer; transition-duration: 0.2s; }
.img_wrap img:hover{ transform: scale(1.2); transition-duration: 0.2s; }
.modal-backdrop.in { filter: alpha(opacity=50); opacity: .8; }
#video video { display: block; border: none; width: 100%; }
.movie_close ,.privacy_close { position: absolute; top: -7%; right:0; z-index: 999; font-size: 3em; opacity: 1; color: #FFF; font-weight: normal; }
.creator_status { color: #FFF; display: flex;}
.creator_status div:nth-child(1) { width: 25%; padding: 1em 1em 0 1em;}
.creator_status div:nth-child(2) { padding: 1em 0 0 0;}
.creator_status dt { font-size: 1.2em; font-weight: bold; }
.creator_status dd { font-size: 1.4rem; }
.modal-dialog { margin: 50px auto;} 
.creator_name { font-size: 10px; font-weight: 600; text-align: center; background: url("../images/name_frame.svg") no-repeat; background-size: 100%; height: 2.5vh; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.button_wrap { width: 90%; margin: 20px auto; }
.button_wrap:hover { opacity: .5; transition: all .2s ease-in-out; }
/* cont-4 */
.cont-4 { background: #ebebeb; }
.item_wrap { position: relative; }
.campaign_obj_posi_9 { position: absolute; width: 20%; top:5%; left: 5%; z-index: 1; }
.campaign_obj_posi_10 { position: absolute; width: 100%; top:30%; left: 0; z-index: 1; }

/* ///////////////////////////////////////////////////////////////////// 
// Media Queries
/////////////////////////////////////////////////////////////////////*/
/* PC */
@media (min-width: 481px) { 
  .view_pc { display: block;}
  #wrap { width: 480px; margin: 0 auto; position: relative; }
  .FV_wrap .FV_position { width: 375px; margin: auto; }
  .FV { width: 375px; height: 100%; left: inherit; }
  .fixed_top ,.FV_bg { left:inherit; width: 375px; }
  .creator_name { padding: 2% 0 0 0; height: 3.5vh; }
  
  /* font-size */
}
/* SP */
@media (max-width: 480px) { 
  .view_sp {display: block;}
  .tokuho_area div:nth-child(1) { width: 80%; font-size: 10px; }
  .tokuho_area div:nth-child(2) { width: 20%; }
  
  
  /* font-size */
  .cont-3 .cont_in h2 { font-size: 13px; }
}
@media (max-width: 420px) {
  .logo_area div img { width: 80%; }
  .logo_area div:nth-child(1) img { float: right; }
  .logo_area div:nth-child(2) img { float: left; }  
  .FV_wrap .FV_position h1 { margin:0 8% 0 8%; }
}