@charset "utf-8";

img.logo,
ul,p,a
.bg_title,
.r_box,
.r_box .intro,
.r_box .intro h1,
.r_box .intro h1 span,
.r_box .intro h1 strong,
.r_box .intro p,
.r_box .intro .link_btn,

.r_box span.blind {
	transition : all 0.5s ease;
    -webkit-transition : all 0.5s ease;	

}

html,body{}

body {background:#020019;}
#wrap {position:relative;}
#wrap span.bg {display:block; width:100%; height:100%; position:fixed; left:0; top:0; z-index:1; background:url(../../../img/intro/2018application/intro-bg.jpg) no-repeat center top; 
-moz-opacity:0; -ms-opacity:0; -o-opacity:0; -webkit-opacity:0; opacity:0; filter:alpha(opacity=0);

transition : all 2s ease; -webkit-transition : all 2s ease;
transition-delay: 0.2s; -webkit-transition-delay: 0.2s;}
#wrap span.bg.on {
-moz-opacity:1; -ms-opacity:1; -o-opacity:1; -webkit-opacity:1; opacity:1; filter:alpha(opacity=100);	
transform: scale(1); -webkit-transform: scale(1);}
.cont-wrap{max-width:1176px; margin:0 auto; position:relative;color:#fff; padding:80px 0 0 0}
.cont-wrap:after{ display:block; clear:both; content:""}
.cont-wrap a.pc{ display:block; position:absolute; right:0; top:80px}
.cont-wrap ul, .cont-wrap p{ position:relative;z-index:10;
-moz-opacity:0; -ms-opacity:0; -o-opacity:0; -webkit-opacity:0; opacity:0; filter:alpha(opacity=0);}
.cont-wrap ul.on{-moz-opacity:1; -ms-opacity:1; -o-opacity:1; -webkit-opacity:1; opacity:1; filter:alpha(opacity=100);
transition : all 1s ease; -webkit-transition : all 1s ease;
transition-delay: 1s; -webkit-transition-delay: 1s}
.cont-wrap p.on{ opacity:0.8; filter:alpha(opacity=80);
transition : all 1s ease; -webkit-transition : all 1s ease;
transition-delay: 1s; -webkit-transition-delay: 1s}
img.logo {position: relative; left:0; top:30px; display:block; z-index:10;
-moz-opacity:0; -ms-opacity:0; -o-opacity:0; -webkit-opacity:0; opacity:0; filter:alpha(opacity=0);
transition : all 1s ease; -webkit-transition : all 1s ease;
transition-delay: 1s; -webkit-transition-delay: 1s;} 
img.logo.on {-moz-opacity:1; -ms-opacity:1; -o-opacity:1; -webkit-opacity:1; opacity:1; filter:alpha(opacity=100);} 
.cont-wrap p{font-family:"Buri", serif; font-size:22px; margin:50px 0 0 0}
.cont-wrap ul{ margin:100px 0 0 0}
.cont-wrap ul:after{ display:block; clear:both; content:""}
.cont-wrap ul li{ width:347px; height:404px; float:left; font-size:27px; text-align:center; margin:0 20px; box-sizing:border-box;  padding:110px 0 0 0}
.cont-wrap ul li span{ display:block; margin:0 0 30px 0}
.cont-wrap ul li a{ display:inline-block; padding:7px 35px; font-size:20px; background:#fff; border-radius:30px}
.cont-wrap ul li.link01 a{color:#cb232c}
.cont-wrap ul li.link02 a{color:#8e6f44}
.cont-wrap ul li.link01{background:url(../../../img/intro/2018application/intro-link-bg01.png) no-repeat ; }
.cont-wrap ul li.link02{background:url(../../../img/intro/2018application/intro-link-bg02.png) no-repeat ; }



.cont-wrap.cont-wrap-type2{ max-width:978px}
.cont-wrap.cont-wrap-type2 ul{ padding:0 0 0 90px}

a.for-mobile{position: relative;  display:block; z-index:10;
-moz-opacity:0; -ms-opacity:0; -o-opacity:0; -webkit-opacity:0; opacity:0; filter:alpha(opacity=0);
transition : all 1s ease; -webkit-transition : all 1s ease;
transition-delay: 1s; -webkit-transition-delay: 1s; border:1px solid #fff; padding:10px 0; width:190px; text-align:center; margin:0 auto; color:#fff; font-size:18px; display:none}
a.for-mobile.on{-moz-opacity:1; -ms-opacity:1; -o-opacity:1; -webkit-opacity:1; opacity:1; filter:alpha(opacity=100);}

@media screen and (max-width: 1160px){
	img.logo{ width:340px; height:62px; left:50%; margin-left:-170px}
	a.pc{ display:none !important}
	a.for-mobile{ display:block }
	.cont-wrap{padding:30px 20px}
	.cont-wrap p{ text-align:center; font-size:18px}
	.cont-wrap ul{width:210px; margin:45px auto 40px}
	.cont-wrap ul li{ width:210px; height:245px;font-size:20px; margin:0 0 15px 0; box-sizing:border-box;  padding:60px 0 0 0}
	.cont-wrap ul li:last-child{float:right}
	.cont-wrap ul li.link01, .cont-wrap ul li.link02{ background-size:cover}
	.cont-wrap ul li a{  padding:7px 20px; font-size:16px;}
	.cont-wrap.cont-wrap-type2 ul{ padding:0}
}

@media screen and (max-width: 845px){
img.logo{ width:340px; height:62px; left:50%; margin-left:-170px}
a.pc{ display:none !important}
a.for-mobile{ display:block }
.cont-wrap{padding:30px 20px}
.cont-wrap p{ text-align:center; font-size:18px}
.cont-wrap ul{width:210px; margin:45px auto 40px}
.cont-wrap ul li{ width:210px; height:245px;font-size:20px; margin:0 0 15px 0; box-sizing:border-box;  padding:60px 0 0 0}
.cont-wrap ul li:last-child{float:right}
.cont-wrap ul li.link01, .cont-wrap ul li.link02{ background-size:cover}
.cont-wrap ul li a{  padding:7px 20px; font-size:16px;}
}

@media screen and (max-width: 600px){
#wrap span.bg{ background-size:cover}
img.logo{ width:307px; height:60px;  margin-left:-153px}
.cont-wrap{padding:5px 20px 45px}
.cont-wrap ul{width:210px; margin-top:25px}
.cont-wrap ul li{float:none; margin-bottom:15px}
.cont-wrap ul li:last-child{float:none}
a.for-mobile{ width:80%}
p span{ display:block}
}


