@charset "utf-8";
#wrap {float:left; width:100%; min-height:100vh; display:flex; background:url(../images/bg_domain.png) center top no-repeat; background-size:cover; transition:all 0.5s;}

/*-------------------------------------------------------------------------------------*
 *  domain                                                                             *
 *-------------------------------------------------------------------------------------*/
.domain_wrap{float:left; width:100%; position:relative; z-index:1;}
.domain_logo{float:left; width:100%; min-height:234px; padding:20px 0 70px; text-align:center; background:url(../images/bg_domain_header.png) center top no-repeat; background-size:100% 100%;}
.domain_logo a{display:block;}
.domain_logo a img{width:100%; max-width:231px; transition:all 0.5s;}

.domain_title{float:left; width:100%; text-align:center; margin:30px 0 0 0; font-family:'EsaManru'; font-weight:700; font-size:60px; color:#ffffff; text-shadow:2px 0 3px rgba(0,0,0,0.6); transition:all 0.5s;}
.domain_title1{display:none; float:left; width:100%; text-align:center; margin:30px 0 0 0;font-family:'EsaManru'; font-weight:700; font-size:70px; color:#ffffff; text-shadow:2px 0 3px rgba(0,0,0,0.6); transition:all 0.5s;}
.domain_title span{color:#ff8e0c;}
.domain_title1 span {color:#ff8e0c;}

.domain_text{float:left; width:100%; text-align:center; margin:20px 0 0 0; font-family:'EsaManru'; font-weight:400; font-size:26px; color:#d3d3d3; text-shadow:2px 0 3px rgba(0,0,0,0.6); transition:all 0.5s;}
.domain_text span{color:#ff9600;}

.domain_text2{float:left; width:100%; text-align:center; margin:40px 0 0 0; font-family:'EsaManru'; font-weight:600; font-size:50px; color:#ffffff; text-shadow:2px 0 3px rgba(0,0,0,0.6); transition:all 0.5s;}
.domain_text2 span{color:#ffb619;}

.domain_btn_wrap{float:left; width:100%; text-align:center; margin:60px 0 0 0; display: flex; justify-content: center;}
.domain_btn_wrap ul{float:left; display: flex; flex-wrap: wrap; justify-content: center;}
.domain_btn_wrap li{float:left; width:301px; height:301px; background:url(../images/bg_domain_btn.png) center top no-repeat; margin:0 40px;transition:all 0.5s;}
.domain_btn_wrap li a{width:100%; height:100%; display:flex; flex-direction: column; align-items: center; justify-content: center;transition:all 0.5s;}
.btn_text1{display:inline-block; margin:10px 0 0 0; font-family:'EsaManru'; font-weight:300; font-size:26px; color:#e6e6e6; text-shadow:2px 0 3px rgba(0,0,0,0.6); transition:all 0.5s;}
.btn_text2{display:inline-block; margin:5px 0 0 0; font-family:'EsaManru'; font-weight:700; font-size:33px; color:#ffffff; text-shadow:2px 0 3px rgba(0,0,0,0.6); transition:all 0.5s;}
.btn_btn{display:inline-block; margin:15px 0 0 0; height:48px; line-height:48px; border-radius:48px; background:rgba(0,0,0,0.3); border:1px solid rgba(0,0,0,0.0); padding:0 30px; font-family:'EsaManru'; font-weight:300; font-size:18px; color:#ffffff; text-shadow:2px 0 3px rgba(0,0,0,0.6); transition:all 0.5s;}
.domain_btn_wrap li:hover{filter:hue-rotate(-20deg);}
.domain_btn_wrap li a:hover .btn_text2{color:#ffdd00;}
.domain_btn_wrap li a:hover .btn_btn{background:rgba(0,0,0,0.7); border:1px solid #ffcc00; color:#ffcc00;}


@media screen and (max-width:1440px) {
.domain_btn_wrap{flex-wrap: wrap;}
.domain_btn_wrap ul{width:100%;}
.domain_btn_wrap ul li{margin:5px}
}

@media screen and (max-width:1024px) {
	.domain_title{font-size:40px; padding:0 30px;}
	.domain_text{font-size:16px; padding:0 30px;}
	.domain_text2{font-size:30px; padding:0 30px;}
	
	.domain_btn_wrap ul{width:100%; padding:0 20px;}
}

@media screen and (max-width:768px) {
	#wrap{height:100%;}
	.domain_wrap{padding:0 0 30px;}
	.domain_logo{min-height:170px; padding:10px 0 40px;}
	.domain_logo a{width:100%;}
	.domain_logo a img{width:25%;}
	
	.domain_title{display:none; margin:20px 0 0 0; font-size:40px;}
	.domain_title1{display:block; margin: 20px 0 0 0; font-size: 40px;}
	.domain_text{margin:20px 0 0 0; font-size:13px;}
	.domain_text2{margin:20px 0 0 0; font-size:22px;}
	.domain_btn_wrap{margin:20px 0 0 0;}
	.domain_btn_wrap ul li{width:47%; height:42vw; margin:0 2% 0 2%; background-size:100% 100%;}
	.domain_btn_wrap ul li:last-child{margin:0;}
	.domain_btn_wrap ul li a img{display:none;}
	.btn_text1{font-size:16px;}
	.btn_text2{font-size:22px;}
	.btn_btn{padding:0 10px; margin:5px 0 0 0; font-size:14px;}
}

@media screen and (max-width:450px) {
.btn_text1{margin:5px 0 0 0; font-size:12px;}
.btn_text2{font-size:16px;}
.btn_btn{margin:10px 0 0 0; font-size:14px; height:30px; line-height:30px;}
}