/* =========================================================
		common
========================================================= */
*{box-sizing: border-box; margin: 0; padding: 0;   -webkit-text-size-adjust: 100%;}
body {font-family: "Noto Sans JP", 'Yu Gothic Medium', '游ゴシック Medium', YuGothic, '游ゴシック体', 'ヒラギノ角ゴ Pro W3', 'メイリオ', sans-serif; line-height: 1.4; color: #333; margin: 0; padding: 0; letter-spacing: 0px; font-size: 16px; overflow-x: hidden;}
.pc-none{ display: none;}
.sp-none{ display: block;}
/* =========================================================
		KV
========================================================= */
.fv_wrap_inner{position: relative;} .fv_wrap{transition: all .3s;}
.fv_title { width: 88%; margin: -5px auto; transition: all .3s;}
.fv_wrap_inner_logo {
    position: absolute; top: 2.8%; left: 50%; transition: all .3s;
    transform: translateX(-50%); width: 62%;  min-width: 850px;
}
.fv_wrap_inner_logo h1{width: 47%; margin: 0 auto -6px;}
.fv_main_view .object-fit { object-fit: cover;  transition: all .3s;
    /*IE*/font-family: 'object-fit: cover; object-position: bottom;';}
.day_wrap {
    outline-offset: 1.5px;
    border-radius: 8px;
    width: 74%;
    text-align: center;
    margin: 0 auto;  position: relative; transition: all .3s;
}
   
    
@media screen and (min-width: 1600px) {
    .fv_wrap_inner_logo{top: calc(100vh - 94vh);}
    .fv_title { width: 90%;}
}
@media screen and (max-width: 1050px) {
    .fv_wrap{width: 1050px;} .fv_wrap_inner_logo{width: 56%; min-width: 850px;}
    #wrapper{width: 1050px; overflow-x: hidden;} body{overflow-x: auto;}
    .fv_title { width: 78%;} .day_wrap{width: 72%;}
    .fv_wrap_inner_logo{top: 2%;}
}
@media screen and (max-width: 767px) {
    .fv_wrap{width: 100%;}
}

/* =========================================================
		contents
========================================================= */
.con-bg1{background-color: #d6e9f7; padding: 80px 0 70px; position: relative; z-index: 25;}
.con-bg2{background-color: #b6e3fd; background:url(../img/present/border_tex_01.jpg); padding: 40px 0 55px; margin-top: -0.5em;}
.con-bg3{background-color: #fffedf; background:url(../img/present/border_tex_02.jpg); padding: 80px 0;}
.con-bg4{background: #fff; padding: 85px 0 90px;}
.flex{display: flex;} .conts{width: 980px; margin: 0 auto;}
.box_mainsize { width: 1050px; background: #fff; margin: 30px auto 55px;; padding: 30px 35px 40px; border-radius: 8px; position: relative; z-index: 20;}
.main_pre_wrap.box_mainsize{z-index: 5;}
.main_pre_btn_wrap{margin-top: 4%;}
.main_pre_wrap_details { min-height: 100%; width: 52%; margin: 1% 0 -2% 1%;}
.main_pre_wrap_details2{flex-wrap: wrap; margin: 3% auto 0.5%;}
.main_pre_wrap_details2 dd { width: 47%; margin: 1.2% 1.5%; justify-content: space-between;}

.main_ttl { width: 860px; margin: 0 auto; position: relative; z-index: 10; padding: 2% 0 0;}
.soratabi_howto_ttl {font-size: 32px; background: #0b5fb2; width: 1050px;
    margin: 0 auto 50px;  padding: 12px 0; text-align: center; color: #fff; letter-spacing: 3px;
}
.main_lot_ttl { width: 84%; margin: -5% auto 2%;}
.main_pre_ttl {width: 47%; margin: -3.5% 0 -10%;}
.main_pre_btn {
    color: #0797a8;  border: solid 2px; font-size: 22px;  font-weight: bold; position: relative;
    padding: 16px 20px;  margin: 0 auto; line-height: 1.3; display: block;
    width: 480px; text-align: center;  border-radius: 30px;
    transition: all .3s;
}
.main_pre_btn::before{
    content: " "; position: absolute; height: 0; width: 0; top: 1.1em; left: 2em;
    border-left: 0.5em solid transparent; border-right: 0.5em solid transparent; border-top: 0.6em solid #62c6d2;}
.main_lot_wrap .main_pre_btn {color: #ea1f7a;}
.main_lot_wrap .main_pre_btn::before{border-top: 0.6em solid #f69fc6;}
.pre_min_att {  width: 94%; margin: -6% auto 0;}
.main_pre_btn:hover{background:#0797a8; color: #fff;}
.main_lot_wrap .main_pre_btn:hover{background:#ea1f7a; color: #fff;}
.present_under { position: relative;  z-index: 10;  width: 1050px; margin: -10px auto 20px;
    background: rgba(255,255,255,0.6); padding: 10px; border-radius: 8px;}
.present_under p{text-align: center; font-weight: bold; letter-spacing: normal; font-size: 26px; color: #0b5fb2;}
.present_under_min {font-size: 0.9em; margin: 0 -0.2em;}
/*---cloud---*/
.cloud_items { position: relative; width: 1050px; margin: 0 auto;}
.cloud_items.ver2{z-index: 15;}
.cloud_no_01, .cloud_no_02, .cloud_no_04, .cloud_no_05{position: absolute; z-index: 1;}
.cloud_no_01 { left: -40%; top: -200px;} .cloud_no_02 { right: -30%; top: -125px;}
.cloud_no_03 { width: 480px;  right: -150px;  top: -90px; position: absolute;}
.cloud_no_04{right: -40%; top: -110px;} .cloud_no_05{left: -27%; top: -53px;}
/*---novelty---*/
.pre_min {width: 760px;  margin: 5% auto 0; }
.con-bg1 .pre_min { margin: 2% auto 5%;}
.pre_min a{display: block; transition:al .3s;}
.pre_min a:hover{ filter: contrast(105%); transition:al .3s;}
.pre_min_add {
    border: solid 3px #76d2dd; border-radius: 8px; background: #fff;
    width: 850px; margin: 1.5% auto 5%; padding: 1%; font-size: 14px;line-height: 1.48;
}
.pre_min_add .flex { align-content: center;  align-items: center;}
.pre_min_add picture { width: 43%; margin-right: 2%; display: block;}
.pre_min_add .text {
    width: 54%;
    text-align: justify;
    border-top: dashed 2px #aedef3;
    border-bottom: dashed 2px #aedef3;
    padding: 2.2% 0;
}
.pre_min_add .bd { font-weight: bold; margin: 1% 0 0; color: #0797a8; font-size: 16px;}
.pre_min_add .text a, p.pre_min_btn a{ color: #0797a8; border: solid 1px; display: inline-block;
    background: #fff; border-radius: 30px; font-size: 14px; padding: 0 18px 0 15px;
    line-height: 2; text-align: center; margin: 10px 6px 0; transition:all .3s;
    position: relative;
    
}
.pre_min_add .text a:hover, p.pre_min_btn a:hover{ background: #0797a8; color: #fff;}
p.pre_min_btn a:hover::before, .pre_min_add .text a::before{border-left: 0.4em solid #fff;;}
.pre_min_add .original_novelty { width: 82%; margin: 2% auto 1%;}
.pre_min_add .text a {
    width: 125px;
}
p.pre_min_btn a {  padding: 10px;
    text-align: center; margin: 30px auto; display: block;
    transition: all .3s; width: 400px; letter-spacing: 0.5px;
    font-weight: bold; line-height: 1.36;
}
p.pre_min_btn a::before, .pre_min_add .text a::before{
     content: " "; position: absolute;
     width: 0; height: 0;
     border-left: 0.4em solid #0797a8;;
     border-top: 0.4em solid transparent;
     border-bottom: 0.4em solid transparent;

}
p.pre_min_btn a::before{ right: 2em; top: 1em;}
.pre_min_add .text a::before {right: 0.5em; top: 0.68em;}
/*---howto---*/
.howto-con{width: 1050px; margin: 0 auto;}
.howto-con h2{width: 490px; margin: 38px auto 30px; }
.howto-con ul{display: flex; flex-wrap: wrap; justify-content: space-between;}
.howto-con li{width: 248.5px;}
.howto-con li dt{text-align: center; font-weight: 600;}
.howto-con li dt h3{font-size: 26px; margin: 0 auto 5px; color: #fff; width: 120px;}
.howto-con .how_pre_wrap h3{background: #08a0b2;} .howto-con .how_lot_wrap h3{background: #ea1f7a;}
.howto-con li dt p {
    font-size: 16px;  padding: 0; line-height: 1.35; height: 100px;
    font-feature-settings: 'palt' 1; display: flex;
    align-items: center; justify-content: center; align-content: center;
}
.div_dot { width: 80%; border: dashed 1px #3083b0; box-shadow: 0 0 0 4px #eaf8ff;
    margin: 90px auto 65px; border-radius: 8px; min-width: 980px;
}
.howto-con li dt .step1-copy{padding: 0 0 0;}
.howto-con li dd{width: 82%; margin: 0 auto;}
.howto-con .arrow{width: 18px; padding-top: 208px;}
.howto-con .how-att{color:#333; font-size: 14px; line-height: 1.4; font-weight: 500; font-feature-settings: 'palt' 1; text-align: center; margin-top: 10px;}
/*---btn---*/
.oubo-btn{margin: 30px auto 0; display: table;}
.oubo-btn a{padding: 10px 15px; width: 650px;  display: block; transition:all .3s;}
.air_infomation a{padding: 10px 15px; width: 700px; margin: 0 auto; display: block; transition:all .3s;}

.air_infomation a img, .air_infomation a:hover img{transition:al .3s;}
.oubo-btn a:hover, .air_infomation a:hover{ filter: hue-rotate(25deg);}


/*---sanitation---*/
.sanitation h3 {
    background: #fff; font-size: 22px; text-align: center; width: 98%;
    margin: 0 auto 2%; padding: 16px; letter-spacing: 1.5px; color: #95872b;
}
.sanitation { width: 980px; margin: 50px auto 10px; justify-content: space-between;}
.sanitation_wrap dd { margin: 0 0.5%; width: 234px;}
/*---attend---*/
.attend_pre_under {width: 632px; margin: 0 auto 40px;}
.attend_pre_under li{font-size: 14px; text-indent: -1em; padding-left: 1em; margin: 0.5em 0;}
.cnt {text-align: center;}
/*---movie---*/
#movie{width: 1000px; margin: 0 auto;}
.movie-title{font-size: 25px; font-weight: 600; padding-bottom: 15px; text-align: center; line-height: 1.35;}
.movie-area{width: 700px; margin: 0 auto;}
.movie-title2{font-size: 25px; font-weight: 600; padding:45px 0 15px; text-align: center; line-height: 1.35; font-feature-settings: 'palt' 1;}
.movie-thum{width: 700px; margin: 0 auto;}
.moviecon{width: 700px; height: 394px; margin: 0 auto;}
.moviecon video{width: 700px; height: auto;}
/*---kiyaku---*/
#kiyaku{padding: 45px 0 0;}
.kiyaku-area{background: #fff; width:950px; margin: 0 auto; padding: 20px 0; border-radius: 5px;}
.kiyaku-inner{width:845px; background: #fff; padding: 25px 10px; height: 480px; overflow-y:auto; margin: 0 auto;}
.kiyaku-inner::-webkit-scrollbar {width: 10px;}
.kiyaku-inner::-webkit-scrollbar-thumb {background: #ccc;border-radius: 5px;}
.kiyaku-inner h3{font-size: 24px; margin-bottom: 20px; font-weight: 600; text-align: center; letter-spacing: 2px;}
.kiyaku-inner h3 span{border-bottom: solid 1px #333;}
.kiyaku-inner .kiyaku-title{font-size: 16px; padding: 22px 0 7px;}
.kiyaku-inner .kiyaku-copy{font-size: 16px; font-feature-settings: 'palt' 1; padding-bottom: 10px;}
.kiyaku-inner .fonts{font-size: 14px;}
.kiyaku-att{padding-bottom: 10px; font-feature-settings: 'palt' 1;}
.kiyaku-att li{padding-left: 14px; text-indent: -14px; padding-bottom: 3px; font-size: 14px;}
.kiyaku-item{padding-bottom: 10px; padding-left: 10px; text-indent: -10px; font-feature-settings: 'palt' 1;}
.kiyaku-item li{padding-bottom: 8px;}
.kiyaku-item li .copy2{padding-top: 5px;}
.kiyaku-item li .example{padding: 10px 0 5px 10px; text-indent: 0; line-height: 1.5;}
.kiyaku-point{padding-bottom: 13px; font-feature-settings: 'palt' 1;}
.kiyaku-point .copy1{padding-bottom: 5px;}
.kiyaku-point .kiyaku-att{padding-bottom: 0;}
.kiyaku-area a{color: #299cd5; text-decoration: none;}
.kiyaku-area a:hover{text-decoration: underline;}
/* =========================================================
		footer
========================================================= */
.footer-inner{background: #289cd4; padding: 25px 0; color: #fff; text-align: center;}
.footer-inner h3{font-size: 24px; padding: 0 0 5px; letter-spacing: 2px; font-weight: 600;}
.footer-inner p{font-size: 18px; font-feature-settings: 'palt' 1; font-weight: 500;}
.footer-inner p span{font-feature-settings: 'palt' 0;}
.copyw{padding: 8px 15px 12px; text-align: right; font-size: 12px;}
.totop {background: #0396df; border-radius: 20px; width: 40px; height: 40px; display: inline-block; margin: 2%; z-index: 999;text-align: right; right: 0; bottom: 0; position: fixed; bottom: 40px; opacity: 0.8; display: none;}
.totop a { display: inline-block; position: relative; width: 41px; height: 40px;}
.totop a::after { position: absolute; content: ""; width: 13px; height: 13px; vertical-align: middle; border-top: 1px solid #fff; border-right: 1px solid #fff; -webkit-transform: rotate(315deg); transform: rotate(315deg); vertical-align: middle; right: 34%; top: 15px;}

/* =========================================================
		tab
========================================================= */
@media screen and (max-width: 1100px) {
#present .illust2 {position: absolute; width: 150px; top: 815px; right: -50px;}
	
}