@charset "utf-8";

/* 01_ reset*/
*, *:before, *:after {margin:0;padding:0; -webkit-box-sizing:border-box; box-sizing:border-box}
html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,

article, aside, canvas, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video { border: 0; outline: 0;  font-size: 100%; margin:0;padding:0; line-height:1}

h1, h2, h3, h4, h5, h6 {font-weight:normal;}

blockquote,q{quotes:none}
blockquote:before,blockquote:after,q:before,q:after{content:"";content:none}

a{text-decoration:none;color:inherit}
a:visited, a:visited *, a.visited, a.visited:visited {text-decoration:none;}
a:hover,a:hover *,a.visited:hover {text-decoration:none;}

ol, ul, li, dd, dl, dt {list-style:none;}

fieldset {padding:0px;margin:0px;border:0px;}
legend{display:none;}


input{-webkit-appearance:none;-moz-appearance:none;appearance:none;font-family:inherit;font-size:inherit;color:inherit;-webkit-border-radius:0;outline-style:none;margin:0;padding:0;border:0}
input:focus,select:focus,textarea:focus,button:focus{outline:0}
input:focus-visible,select:focus-visible,textarea:focus-visible,button:focus-visible{outline:auto}

input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active{-webkit-transition:background-color 5000s;transition:background-color 5000s;-webkit-text-fill-color:#333!important;-webkit-box-shadow:0 0 0 30px #fff inset}
input::-ms-check{-ms-filter:alpha(opacity=0);filter:alpha(opacity=0);opacity:0}

button{font-family:inherit;background:none;cursor:pointer;border-radius:0;border:0}

select{-webkit-appearance:none;-moz-appearance:none;appearance:none;font-family:inherit;font-size:inherit;color:inherit;border:0;position:relative}
select::-ms-expand{display:none}

textarea{font-family:inherit;font-size:inherit;color:inherit;}

table caption{text-indent:-9999px;font-size:0}

img {border:0px; vertical-align:top;}


/* 02_ common */
html{font-size:62.5%;-webkit-font-smoothing:antialiased;}
body{ transform: skew(-0.04deg); color:#6e6f71; font-family: -apple-system, BlinkMacSystemFont,"NanumSquare",sans-serif;  font-weight: 400; letter-spacing: -0.03em; font-size: 1.6rem;  -webkit-font-smoothing: antialiased; word-wrap: break-word; word-break: keep-all;}
:root {color-scheme: light only;}

/* 03_ layout */
.inner{width:100%; max-width:136rem; height:100vh; padding:0 2rem; margin:0 auto;}

#intro_header .logo{padding:5rem 10rem;}
#intro_header .logo a{display:block; text-align:center;} 
#intro_footer .f_top{padding-bottom:1rem; border-bottom:1px solid #9d9d9d;}
#intro_footer .f_top .tell{display: flex; align-items: center; justify-content: center; gap: 2.2rem; font-size:1.7rem;}
#intro_footer .f_top .tell li{position:relative; font-weight: 600;}
#intro_footer .f_top .tell li + li:before{content:''; display:block; width:1px; height:14px; background:#6e6f71; position:absolute; top:1px; left:-11px;}
#intro_footer .f_top .tell li strong{color:#fbb040; font-weight: 800;}
#intro_footer .f_bottom{color: #9d9d9d;  padding: 1rem 0;  font-size: 1.4rem;  display: flex;  align-items: center;  justify-content: center;}
#intro_footer .f_bottom .address span{position:relative; }
#intro_footer .f_bottom .address .slash{padding-left:1rem;}
#intro_footer .f_bottom .address .slash:before{content:'/'; display:block; color:#6e6f71; position:absolute;     top: 2px;  left: 2px;  font-size: 1.2rem;}
#intro_footer .f_bottom .copyright{padding-left: 1rem;}

.intro_w{ margin: 3rem 0 12rem;}
.intro_w .item_box{ width: 100%;  display: flex;  align-items: center; justify-content: space-between;  gap: 1rem;}
.intro_w .item_box > li{ width: calc(100% / 3 - 1rem);  height: 58.6rem;}
.intro_w .item_box > li a{position:relative; display:block; width:100%; height: 100%; overflow:hidden;}
.intro_w .item_box > li a:before{transition:all .2s;  content: ''; display: inline-block; width: 100%; height: 100%; position: absolute; left: 0;  top: 0; background: #000;  opacity: 0.45;}
.intro_w .item_box > li a.lk_item01{background:url(../img/lkitem01_img.png) no-repeat; background-position: -14rem -4rem;}
.intro_w .item_box > li a.lk_item02{background:url(../img/lkitem02_img.png) no-repeat; background-position: -31rem 0;}
.intro_w .item_box > li a.lk_item03{background:url(../img/lkitem03_img.png) no-repeat; background-position: -35rem 0;}
.intro_w .item_box > li a .text{position: absolute;  bottom: 0;  left: 0;  padding: 4.5rem 3rem;  width: 100%;}
.intro_w .item_box > li a .text .sm_t{color:#c7c7c7; font-size:1.5rem; letter-spacing: 0;}
.intro_w .item_box > li a .text .tit{display: flex; align-items: center; justify-content: flex-start; gap: 1.8rem; padding: 0.6rem 0 2.3rem;}
.intro_w .item_box > li a .text .tit h2{color:#fff; font-size:3.7rem; font-weight:800;}
.intro_w .item_box > li a .text .tit img{}
.intro_w .item_box > li a .text .tit_m{display:none; padding: 0.6rem 0 2.3rem;}
.intro_w .item_box > li a .text .tit_m h2{color:#fff; font-size:3.7rem; font-weight:800;}
.intro_w .item_box > li a .text .tit_m img{display:none;}
.intro_w .item_box > li a .text .mid_t{color:#fff; font-size:2.1rem; line-height:1.2; font-weight: 400;}
.intro_w .item_box > li a .text .mid_t span{color:#fbb040;}
.intro_w .item_box > li a .text .m_mid_t{display:none; color:#fbb040; font-size:1.5rem; line-height: 1.2; font-weight: 600;}
.intro_w .item_box > li a .text_hover{display:none; position: absolute; bottom: 0; left: 0; width: 100%; height:100%; color: #fff; z-index: 1; transition:all .5s;}
.intro_w .item_box > li a .text_hover > ul{ width: 100%; height: 100%; letter-spacing: -0.05em; display: flex; align-items: center; justify-content: center; flex-direction: column; text-align: center; gap: 4rem;}
.intro_w .item_box > li a .text_hover > ul.ln_sm{gap:2.2rem;}
.intro_w .item_box > li a .text_hover > ul li .t_txt{font-size: 2rem; font-weight: 500; color: #fbb040;}
.intro_w .item_box > li a .text_hover > ul li .s_txt{font-size: 1.5rem; opacity: 0.65; padding-top: 1rem; line-height:1.3; font-weight: 500;}
.intro_w .item_box > li a .text_hover > ul li .s_txt span{font-weight:400;}



	@media screen and (min-width:1200px){
		
		.intro_w .item_box li a:hover:before,
		.intro_w .item_box li a:focus:before{opacity:0.75;}
		.intro_w .item_box li a:hover .text,
		.intro_w .item_box li a:focus .text{display:none;}
		.intro_w .item_box li a:hover .text_hover,
		.intro_w .item_box li a:focus .text_hover{display:block; }
	
	}

	@media screen and (max-width:1200px){
		
		#intro_header .logo{padding:2rem;}
		.intro_w{margin:2rem 0 5rem;}
		.intro_w .item_box{flex-direction:column;}
		.intro_w .item_box > li{width:100%; height:22rem; text-align:center;}
		.intro_w .item_box > li a.lk_item01{background-position:center center; background-size:cover;}
		.intro_w .item_box > li a.lk_item02{background-position:center center; background-size:cover;}
		.intro_w .item_box > li a.lk_item03{background-position:center center; background-size:cover;}
		.intro_w .item_box > li a .text{padding: 0; bottom: 50%;  transform: translateY(50%);}
		.intro_w .item_box > li a .text .tit{display:block;}
		.intro_w .item_box > li a .text .tit img{display:none;}
		.intro_w .item_box > li a .text .tit.last{display:none;}
		.intro_w .item_box > li a .text .tit_m{display:block; padding: 0.6rem 0 2.3rem;}
		.intro_w .item_box > li a .text .tit_m h2{color:#fff; font-size:3.7rem; font-weight:800;}
		.intro_w .item_box > li a .text .mid_t{display:none;}
		.intro_w .item_box > li a .text .m_mid_t{display:block;}

	}

	@media screen and (max-width:860px){
		
		#intro_footer .f_top{display:none;}
		#intro_footer .f_bottom{flex-direction: column; border-top: 1px solid #9d9d9d;}
		#intro_footer .f_bottom .copyright{padding:0.5rem 0;}		

	}

	@media screen and (max-width:480px){
		
		html{font-size:56.25%;}
		#intro_header .logo a img{width:14rem;}
		#intro_footer .f_bottom{font-size:1rem;}
		.intro_w{margin:0 0 3rem;}
		.intro_w .item_box > li a .text .sm_t{font-size:1.2rem;}
		.intro_w .item_box > li a .text .tit h2{font-size:2.6rem;}
		.intro_w .item_box > li a .text .tit_m h2{font-size:2.6rem;}
		.intro_w .item_box > li a .text .mid_t{font-size:1.5rem;}

	}

	@media screen and (max-width:360px){
		
		#intro_footer .f_bottom .address {text-align:center;}
		#intro_footer .f_bottom .address span{display:inline-block;}
		#intro_footer .f_bottom .address .slash{padding-left:0; padding-top:0.3rem;}
		#intro_footer .f_bottom .address .slash:before{display:none;}
	}





