@charset "utf-8";
@import url('/design/common/css/Pretendard.css');
@media all and (max-width:1240px) {
    html {font-size:0.95px;}
}
@media all and (max-width:768px) {
    html {font-size:0.9px;}
}

/*var*/
:root {
    --hcenter: translate(0, calc(-50% + 0.5px));
    --wcenter: translate(calc(-50% + 0.5px), 0) ;
    --center: translate(calc(-50% + 0.5px), calc(-50% + 0.5px)) ;
    --blue: #1f58cc;
    --green: #369244;
    --red: #d51a3c;
    --g_txt: #6c6c6c;
}

/*common*/
::-webkit-scrollbar {width:18px;}
::-webkit-scrollbar-thumb {border:5px  solid #fff; border-radius:20px; background:#999;}
::-webkit-scrollbar-track {background:#fff; border-radius:20px;}

html { background:#fbfbfb; }
body, input, button, textarea, select { font-family:'Pretendard', '맑은 고딕', sans-serif; font-weight:400; font-size:17rem; color:#323232; line-height:1.7; letter-spacing: -0.2px;}
input, button, textarea, select { background:#fff; border-radius:0; vertical-align:middle; border:1px solid #ddd;}
button, input[type="submit"] { cursor:pointer; }
a { color:#323232; }

.wrap { max-width:1480px; width:96%; margin:0 auto; }
body {padding-left:100rem;}
#container {padding-top:100rem; }
@media all and (max-width:1023px){
    body {padding-left:70rem;}
}
@media all and (max-width:768px){
    body {padding:70rem 0 0;}
}

/*header*/
header { position:absolute; left:100rem; top:0; width:calc(100% - 100rem); z-index:20; }
header .wrap {position:relative; height:100rem; z-index:2; }
header .wrap::after {content:''; display:table; clear:both; }
header h1 { position:absolute; left:0; top:25rem; padding-left:100rem; line-height:1.3; }
header h1::before {content:''; position:absolute; left:0; top:50%; width:90rem; height:45rem; background:url('/design/icevalley/img/layout/logo.png') no-repeat 0 0/100% auto; transform:var(--hcenter); }
header h1 p {float:left;}
header h1 p:not(.site_name) { font-size:28rem;  }
header h1 p:not(.site_name) span { display:block; font-size:10rem; color:#a1a1a1; text-transform:uppercase; font-weight:400; letter-spacing:0.3rem; }
header h1 p.site_name { position:relative; font-size:22rem; padding:10rem 0 0 60rem; }
header h1 p.site_name::before { content:''; position:absolute; left:30rem; top:13rem; width:1px; height:22rem; background:#d6d6d6; }
header .search_btn { position:absolute; right:0; top:27rem; width:45rem; height:45rem; background:url('/design/icevalley/img/layout/search_icon.png') no-repeat 0 0/200% auto; text-indent:-999999px; }
@media all and (max-width:1023px){
    header {left: 70rem; width:calc(100% - 70rem);}
}
@media all and (max-width:768px){
    header { top:70rem; left:0; width:100%; }
}
@media all and (max-width:480px){
    header h1 p:not(.site_name) { display:none; }
    header h1 p.site_name {padding-left:10rem;}
    header h1 p.site_name::before {display:none;}
}

/*search*/
#search_wrap { display:none; position:absolute; top:100rem; left:0; width:100%; background:#fff; padding:30rem 0 50rem; box-shadow:0 20px 20px rgba(0,0,0,0.1);}
#search_wrap form { max-width:600rem; width:96%; margin:0 auto;  border-radius:20rem; background:#fff; border:2px solid var(--blue); overflow:hidden; }
#search_wrap form input[type="text"] { width:calc(100% - 70rem); float:left; display:block; border:0; line-height:70rem; height:70rem; padding:0 30rem; }
#search_wrap form a { position:relative; float:left; width:70rem; height:70rem; text-indent:-9999px; background:var(--blue); }
#search_wrap form a::before { content:''; position:absolute; left:50%; top:50%; width:45rem; height:45rem; background:url('/design/icevalley/img/layout/search_icon.png') no-repeat 100% 0/200% auto; transform:var(--center); }
.search_close { display:block; position:absolute; bottom:-30rem; left:50%; width:60rem; height:60rem; background:#fff; border-radius:50%; transform:var(--wcenter); text-indent:-999999px;}
.search_close span {position:absolute; left:34%; top:45%; }
.search_close span::before,
.search_close span::after {content:''; position:absolute; left:0; top:0; width:20rem; height:2px; background:rgba(50,50,50,1);}
.search_close span::before {top:0; transform:rotate(45deg);}
.search_close span::after {top:0; transform:rotate(-45deg);}

/*fixed*/
header .fixed { display:flex; align-items:center; position:fixed; left:0; top:0; width:100rem; height:100%; background:#fff; border-right:1px solid #e9e9e9; z-index:10; }
header .fixed .link { width:100%; margin-top:100rem; }
header .fixed .link a { position:relative; display:block; width:25rem; margin:40rem auto;text-align:center; padding-bottom:30rem; line-height:1.2; }
header .fixed .link a::after {content:''; position:absolute; left:0; bottom:0; width:25rem; height:25rem; background:var(--red) url('/design/icevalley/img/layout/more_icon.gif') no-repeat center; border-radius:50%; }
header .fixed .link a:first-of-type::after { background-color:var(--green); }
@media all and (max-width:1023px){
    header .fixed {width:70rem;}
}
@media all and (max-width:768px){
    header .fixed {width:100%; height:70rem; border-right:0; border-bottom:1px solid #e9e9e9; }
    header .fixed .link {margin:0 1% 0 0; text-align:right;}
    header .fixed .link a { display:inline-block; width:auto; margin:0 10rem; padding:0 30rem 0 0; }
    header .fixed .link a::after {left:auto; right:0; top:-2rem;}
}

/*pc_navi*/
#pc_nav { float:right; margin:32rem 45rem 0 0; width:700rem; transition:0.4s; }
#pc_nav .depth1 > li { position:relative; float:left; width:22%;text-align:center;  }
#pc_nav .depth1 > li:first-of-type {width:34%;}
#pc_nav .depth1 > li::before {content:''; position:absolute; left:0; top:20rem; width:7rem; height:7rem; background:#ddd; border-radius:50%; }
#pc_nav .depth1 > li:first-of-type::before { display:none; }
#pc_nav .depth1 > li > a {display:block; font-size:21rem; padding:0 25rem; font-weight:600; white-space:nowrap; }
#pc_nav .depth1 > li > a.on { color:var(--blue); }
#pc_nav .depth2 { height:0; overflow:hidden; transition:0.2s; }
#pc_nav .depth3 {display:none;}


header .nav_bg { position:absolute; left:0; top:0; width:100%; height:0; background:#fff; box-shadow:0 0 20rem rgba(0,0,0,0.2); transition:0.2s; z-index:1; }
header.nav_on::before { content:''; position:absolute; left:0; top:100rem; width:100%; height:1px; background:#e9e9e9; z-index:2; }
header.nav_on .nav_bg { height:400rem; }
header.nav_on #pc_nav { margin:32rem 50rem 0 450rem; width:calc(100% - 500rem); }
header.nav_on #pc_nav .depth2 { display:block; position:absolute; left:0; top:68rem; width:100%; height:300rem; padding:20rem 0; border-left:1px solid #e9e9e9; z-index:10; }
header.nav_on #pc_nav li:last-of-type .depth2 {border-right:1px solid #e9e9e9; }
header.nav_on #pc_nav a.on+.depth2 {background:var(--blue); }
header.nav_on #pc_nav .depth2 a { display:inline-block; padding:4rem;  }
header.nav_on #pc_nav a.on+.depth2 a { color:#fff; }
@media all and (min-width:1601px){
    header.nav_on #pc_nav .depth1 > li {width:25% !important;}
}
@media all and (max-width:1340px){
    #pc_nav {display:none;}
}

/*mobile_navi*/
.sitemap { display:block; position:absolute; left:0; top:0; width:100rem; height:100rem; background-color:var(--blue); text-indent:-999999px;}
.sitemap.off { background:var(--blue) url('/design/icevalley/img/layout/nav_icon.gif') no-repeat center; }
.sitemap.on::before,
.sitemap.on::after { content:''; position:absolute; left:31%; top:49%; width:40rem; height:1px; background:#fff; transform:rotate(45deg); }
.sitemap.on::after {transform:rotate(-45deg); }
#mnav_open {display:none;}
@media all and (max-width:1340px){
    .sitemap { display:none;}
    #mnav_open {display:block;}
}
@media all and (max-width:1023px){
    .sitemap { width:70rem; height:70rem;}
    .sitemap.on::before,
    .sitemap.on::after { left:23%; }
}
#m_nav { position:fixed; left:100rem; top:-100%; width:calc(100% - 100rem); height:100%; transition:0.3s; background:#fbfbfb; overflow-y:auto; }
#m_nav ul { position:absolute; left:-1px; top:0; width:33%; height:100%; padding:50rem; border-left:1px solid rgba(0,0,0,0.08); z-index:20; }
#m_nav li { border-bottom:1px dashed #e9e9e9; }
#m_nav a { display:inline-block; font-size:22rem; padding:10rem 0; word-break:break-all; }
#m_nav li a {padding:10rem 40rem 10rem 0; }
#m_nav .depth2, #m_nav .depth3  { width:100%; left:100%; transition:0.3s; opacity:0; z-index:-1; }
#m_nav li.on > .depth2, #m_nav li.on > .depth3 { left:100%; opacity:1; z-index:1; }
#m_nav li.more > a::before {content:'→'; position:absolute; right:50rem; text-align:right; color:#aaa; }
#m_nav li.more.on > a::before, #m_nav li:hover.more > a::before {color:var(--blue); }
#m_nav a:hover, #m_nav li.on > a { font-weight:600; color:var(--blue); }
@media all and (max-width:1023px){
    #m_nav { left:70rem; width:calc(100% - 70rem);}
    #m_nav ul {width:33.33%; padding:30rem;}
    #m_nav a { font-size:20rem; }
    #m_nav li.more > a::before { right:30rem; }
}
@media all and (max-width:768px){
    #m_nav { left:0; width:100%; height:calc(100% - 70rem); margin-top:70rem; }
    #m_nav a { display:block; }
    #m_nav ul { position:relative; width:100%; height:auto !important; border-left:0; }
    #m_nav .depth2, #m_nav .depth3 {left:auto !important; top:auto !important; height:0 !important; padding:0; overflow:hidden; }
    #m_nav li.on > .depth2, #m_nav .depth2 > li.on > .depth3 { height:auto !important; }
    #m_nav li.more > a::before { content:'▼'; font-size:12rem; margin-top:6rem; }
    #m_nav .depth2 { background:#fff; }
    #m_nav .depth2 li a {font-size:17rem; padding:10rem 20rem;}
    #m_nav .depth2 > li.on > a { background:var(--blue); color:#fff; }
    #m_nav .depth3 { border-bottom:1px dashed #ddd; }
    #m_nav .depth2 li.on .depth3 { padding:10rem 0; }
    #m_nav .depth3 li {border-bottom:0;}
    #m_nav .depth3 li a { position:relative; padding:5rem 20rem 5rem 30rem; }
    #m_nav .depth3 li a::before { content:''; display:block; position:absolute; left:20rem; top:15rem; width:4px; height:4px; background:#333; }
}

/*blank*/
#pc_nav a[target="_blank"] span,
#m_nav a[target="_blank"] span{display: inline-block; padding-right: 20rem; position: relative; }
#pc_nav a[target="_blank"] span::before,
#m_nav a[target="_blank"] span::before{position: absolute; content: ""; width: 14px; height: 14px; right: 0; top: 8px; background: url('/design/common/img/blank.png') no-repeat; background-position-x: -14px;}
#m_nav a[target="_blank"] span::before{top: 10px;}
#pc_nav .depth1 > li > a[target="_blank"] span::before{background-position-x: 0; top: 10px;}
#pc_nav .depth1 > li > a.on + .depth2 > li > a[target="_blank"] span::before{background-position-x: -28px;}
@media all and (max-width:768px){
    #m_nav a[target="_blank"] span::before{top: 6px;}
}

/*footer*/
footer { position:relative; margin-top: 70rem;}
footer .wrap {position:relative; border-top:2px solid #e9e9e9; padding-top:40rem;}
footer .f_link {margin:30rem 0 25rem;}
footer .f_link a {margin-right:20rem;}
footer .f_link a.privacy {color:#007e68; border-bottom:1px solid #007e68; font-weight:600;}
footer .f_info {margin-bottom:40rem;}
footer .f_info address {display:flex; margin-bottom:7rem;}
footer .f_info address p,
footer .f_info address div {margin-right:35rem;}
footer .f_info address div b {margin-right:10rem;}
footer .f_info small {font-size:15rem; color:#a3a3a3;}
@media all and (max-width:1023px){
    footer .f_link a {margin-right:10rem;}
    footer .f_info address {flex-wrap:wrap;}
    footer .f_info address p {width:100%;}
}
@media all and (max-width:905px){
    footer .f_link a {margin-right:10rem;}
    footer .f_info address {flex-wrap:wrap;}
    footer .f_info address div {width:100%;}
    footer .f_info address p {width:100%;}
}

	/*상단으로가기*/
	.go_top {display:block; position:fixed; bottom:25rem; right:70rem; width:60rem; height:60rem; padding:26rem 0 0; background:#3b3c45; color:#fff; font-size:13rem; letter-spacing:1rem; text-align:center; border-radius:50%; opacity:0; transition:all 0.5s; font-weight:600; z-index:100;}
  	.go_top:before {content:''; position:absolute; left:50%; top:15rem; width:5rem; height:5rem; margin-left:-1rem; border-top:2px solid #fff; border-right:2px solid #fff; transform:rotate(-45deg) translate(-50%, 0);}

  	@media all and (max-width:1890px){
    	.go_top{right:35rem;}
    }
