@charset "utf-8";
#wrap {float:left; width:100%; overflow:hidden; background:url(../images/bg.jpg) center top repeat-y; background-size:100%;height:100%;}

/*-------------------------------------------------------------------------------------*
 *  landing                                                                             *
 *-------------------------------------------------------------------------------------*/
.landing_box{width:1400px; margin:0 auto; padding:0 0 70px 0; position:relative;}
.logo{float:left; width:100%; text-align:center; position:relative; z-index:1;}
.logo img{transition:all 0.5s;}
.slogan{float:left; width:100%; text-align:center;}
.slogan_m{display:none;}
.main_btn{float:left; width:100%; margin:10px 0 0 0; position:relative; text-align:center;}
.main_btn a{display:inline-block;}
.main_btn a img{transition:all 0.5s;}
.main_btn_title{position:absolute; left:50%; top:30px; z-index:99; transform:translate(-50%); font-family:'GmarketSans'; font-weight:500; font-size:20px; color:#964720; cursor:pointer;}
.main_btn_title.title_m{display:none;}
.btn_box{float:left; width:100%; margin:20px 0 0 0; text-align:center;}
.btn_box ul{display:inline-block;}
.btn_box li{float:left;}
.btn_box li a{display:block;}
.btn_box li a:hover img{display:none; transition:all 0.5s;}
.btn_box li a:hover .overimg{display:block;}
.overimg{display:none;}
.title01{float:left; width:100%; margin:20px 0 0 0; text-align:center;}
.title01 img{transition:all 0.5s;}
.title02{float:left; width:100%; text-align:center;}
.title02 img{transition:all 0.5s;}
.bottom_item{float:left; width:100%; margin:40px 0 0 0; text-align:center;}
.bottom_item img{transition:all 0.5s;}

.bg_item01{position:absolute; left:50%; transform:translate(-50%);}
.bg_item01 img{mix-blend-mode: screen;}
.bg_item02{position:absolute; left:50%; top:595px; transform:translate(80%); transition:all 0.5s;}

.mobile_item01{position:absolute; left:50%; top:600px; margin-left:-950px;}
.mobile{position:absolute; left:50%; top:670px; margin-left:-610px;}
.mobile_m{float:left; width:100%; margin:0px 0 0 0; text-align:center; transform:rotate(-19deg); display:none;}
.mobile_m img{width:50%; transition:all 0.5s;}
@media screen and (max-width:1440px) {
    .landing_box{float:left; width:100%; padding:0 10px;}
	.slogan img{width:100%;}
	.bottom_item img{width:100%;}
}

@media screen and (max-width:1024px) {
	.title01 img{width:90%;}
}

@media screen and (max-width:768px) {
	.bg_item01{display:none;}
	.logo img{width:70%;}
	.slogan_pc{display:none;}
	.slogan_m{display:block;}
	.main_btn a img{width:80%;}
	.main_btn_title{top:2.5vw; font-size:16px;}
	.main_btn_title.title_pc{display:none;}
	.main_btn_title.title_m{display:block;}
	.btn_box li{width:33%; margin:0 0.5% 0 0;}
	.btn_box li:nth-child(3n){margin:0 0% 0 0;}
	.btn_box li a{width:100%}
	.btn_box li a img{width:100%}
	.title01{margin:10px 0 0 0;}
	.title02 img{width:80%;}
	.mobile_item01{top:69%; margin-left:-50vw; width:50%;}
	.mobile_item01 img{width:100%;}
	.mobile{display:none;}
	.mobile_m{display:block;}
	.bg_item02{top:70%; transform:translate(15%); width:50%;}
	.bg_item02 img{width:100%;}
	.bottom_item{margin:20px 0 0 0;}
}

@media screen and (max-width:450px) {
	.main_btn a img{width:95%;}
	.main_btn_title{top:2.5vw; font-size:14px;}
}
.down {list-style:none;width: 100%;text-align: center;}