@charset "UTF-8";

.pc { display:block; }
.sp { display:none; }
.flexbox01 { display:flex; flex-direction:row; flex-wrap:wrap; }
.flexbox02 { display:flex; flex-direction:row; flex-wrap:wrap; justify-content:flex-end; }
.flexbox03 { display:flex; flex-direction:row; flex-wrap:nowrap; justify-content:space-between; }
.flexbox04 { display:flex; flex-direction:row; flex-wrap:wrap; justify-content:space-between; }
.fon_mont { font-family:'Montserrat', sans-serif; }

#teaser_wrapper { padding:100px 0 0 0; font-feature-settings:"palt"; letter-spacing:0.1em; color:#262d30; }
.teaser_inner { position:relative; margin:0 auto; font-size:160%; letter-spacing:0.1em; line-height:1.8em; max-width:1240px; overflow:auto; }

#teaser_header { position:fixed; top:0; width:100%; height:100px; background:#fff; border-bottom:solid 1px #dbdbdb; z-index:200; }
#teaser_header #company_logo {}
#teaser_header #company_logo h1#logo01 { margin:26px 30px 0 0; width:155px; }
#teaser_header #company_logo div#logo02 { margin:32px 0 0 0; width:180px; }
#teaser_header #teaser_header_nav { margin:36px 0 0 0; width:35%; }
#teaser_header #teaser_header_nav li { font-size:1.4rem; }
#teaser_header #teaser_header_nav li a:hover { color:#006db7; }

#teaser_footer_bnr { margin:150px 0 0 0; }
#teaser_footer_bnr ul { margin:0 0 100px; }
#teaser_footer_bnr ul li { margin:0 0 30px; width:49%; }
#teaser_footer_bnr ul li a:hover { opacity:0.8; }
#teaser_footer_bnr ul li a img { width:100%; border:solid 1px #000; }
#teaser_footer_bnr #foot_bnr { margin:0 auto 30px; width:60%; }
#teaser_footer_bnr #foot_bnr a:hover img { opacity:0.8; filter:opacity(80%); }
.mt_60 { margin-top:60px!important;}
.mt_80 { margin-top:80px!important;}
.mt_200 { margin-top:200px!important;}

div.btnshape01 { margin:85px auto 0; width:36%; text-align:center; }
div.btnshape01 a { padding:15px 0; font-size:2.2rem; font-weight:bold; text-align:center; background-color:#fff; display:block; filter:drop-shadow(4px 4px 0 rgba(0,0,0,1)); transform:translateZ(0); border:solid 2px #000; border-radius:30px; }
div.btnshape01 a:hover { margin:2px 0 0 2px; filter:drop-shadow(2px 2px 0 rgba(0,0,0,1)); transform:translateZ(0);}
div.btnshape02 { margin:40px auto 0; padding:0 0 10px; width:20%; text-align:center; }
div.btnshape02 a { padding:5px 0; font-size:1.6rem; font-weight:bold; text-align:center; background-color:#fff; display:block; filter:drop-shadow(4px 4px 0 rgba(0,0,0,1)); transform:translateZ(0); border:solid 2px #000; border-radius:30px; }
div.btnshape02 a:hover { margin:2px 0 0 2px; filter:drop-shadow(2px 2px 0 rgba(0,0,0,1)); transform:translateZ(0);}

#header #navi { display:none; }
#header .nav_btn { display:none; }
.movie_ttl { padding:0 0 0 60px; background-image:url(../images/common/play.png); background-size:48px 32px; background-repeat:no-repeat; }
.youtube { margin:0 auto; width:100%; max-width:900px; }
.youtube figure.pufac_ph { overflow:hidden; z-index:100; }
.youtube figure.pufac_ph img { transition:0.6s all; }
.youtube figure.pufac_ph img:hover { transform:scale(1.1,1.1); transition:0.6s all; }
.breadcrumbs { margin:0; }
.breadcrumbs li { font-size:1.2rem; }
.breadcrumbs li a { }
.breadcrumbs li a:hover { color:#006db7; }
.breadcrumbs li span { margin:0 0 0 10px; padding:0 0 0 18px; background-image: url(../images/common/bred_arw.png); background-position:center left; background-repeat:no-repeat; }
.mt_20 { margin:20px 0 0 0; }
.mt_100 { margin:100px 0 0 0; }
.ab_mt20 { position:absolute; top:20px; }
.z_20 { z-index:20; }

ul.footer_sk_logo { margin:-20px 40px 0 0; width:25%; display:flex; flex-direction:row; flex-wrap:wrap; justify-content:flex-end;align-items:center;float:right; }
ul.footer_sk_logo li:first-child { margin-right:2%; width:38%; }
ul.footer_sk_logo li:last-child { width:60%; }

.pc_btn { display:block; }
.sp_btn { display:none; }





@media only screen and (max-width: 1240px) {

}









@media only screen and (max-width: 960px) {

.pc { display:none; }
.sp { display:block; }

.flexbox01 { display:flex; flex-direction:row; flex-wrap:wrap; }
.flexbox02 { display:flex; flex-direction:row; flex-wrap:wrap; justify-content:space-between; }
.flexbox03 { display:flex; flex-direction:row; flex-wrap:wrap; justify-content:space-between; }
.flexbox04 { display:flex; flex-direction:row; flex-wrap:wrap; justify-content:space-between; }

#teaser_wrapper { padding:57px 0 0 0; }
.teaser_inner { position:relative; margin:0 5%; font-size:130%; letter-spacing:0em; line-height:1.6em; max-width:90%; }

#teaser_header { height:57px; }
#teaser_header #company_logo {}
#teaser_header #company_logo h1#logo01 { margin:13px 20px 0 0; width:93px; }
#teaser_header #company_logo div#logo02 { margin:18px 0 0 0; width:108px; }
#teaser_header #teaser_header_nav { display:none; }

#teaser_footer_bnr { margin:100px 0 0 0; }
#teaser_footer_bnr ul { margin:0 0 50px; }
#teaser_footer_bnr ul li { margin:0 0 30px; width:49%; }
#teaser_footer_bnr ul li a img { width:100%;}

div.btnshape01 { margin:30px auto 0; width:70%; }
div.btnshape01 a { padding:10px 0; font-size:1.6rem; }
div.btnshape01 a:hover { margin:2px 0 0 2px; }
div.btnshape02 { margin:20px auto 0; width:70%;  }
div.btnshape02 a { padding:5px 0; font-size:1.4rem; }
div.btnshape02 a:hover { margin:2px 0 0 2px; }

.modal-video-close-btn { right:10px!important; }

}

@media only screen and (max-width: 768px) {
.teaser_inner { position:relative; margin:0 5%; font-size:130%; letter-spacing:0em; line-height:1.6em; max-width:90%; }

#teaser_footer_bnr { margin:50px 0 0 0; }
#teaser_footer_bnr ul { margin:0 0 0; }
#teaser_footer_bnr #foot_bnr { margin:0 auto 30px; width:70%; }

ul.footer_sk_logo { margin:0 auto; width:60%; display:flex; flex-direction:row; flex-wrap:wrap; justify-content:flex-end; float:none; }
ul.footer_sk_logo li:first-child { margin-right:4%; width:38%; }
ul.footer_sk_logo li:last-child { width:58%; }



}






@media screen and (max-width: 520px) {
.btn_card_wrapper #btm_card { position:fixed; top:auto; bottom:0; right:auto; margin:0 7% 0 5%; width:88%; z-index:100; }
.btn_card_wrapper #btm_card img { height:auto; width:100%; }
.btn_card_wrapper #btm_card a:hover { opacity:1; }
.pc_btn { display:none; }
.sp_btn { display:block; }

#teaser_footer_bnr { margin:60px 0 0 0; }
#teaser_footer_bnr ul { margin:0 0 0; }
#teaser_footer_bnr ul li { margin:0 0 20px; width:100%; }
#teaser_footer_bnr ul li a img { width:100%; }
#teaser_footer_bnr #foot_bnr { margin:0 auto 30px; width:100%; }





@media screen and (max-width: 375px) {
}

}