@charset "utf-8"; 
@import url("./font/nanumhuman/NanumHuman.css");
@import url("./font/suite/SUITE.css");

/* color */ 
:root {
 --color1: #0083a7;  /* 밝은 기본색 */
 --color2: #004a5f;  /* 어두운 기본색  */
 --color3: #f9c969;  /* 살구색 */
 --color4: #e8cfb1;  /* 베이지색 */ 
 --color5: #f0fafc;  /* 하늘색 */ 
 --color6: #d8640e;  /* 주황색 */
 --color7: #f2c83c;  /* 노랑 */ 
 --line1: #d9d9d9;   /* 선색 */  
}
 
/* font */ 
:root {
 --fm1:'NanumHuman'; 
 --fm2:'SUITE';   
 --fm200:'NanumHumanEL';
 --fm300:'NanumHumanLight';
 --fm400:'NanumHuman';   
 --fm700:'NanumHumanBold'; 
 --fm800:'NanumHumanEB'; 
 --fm900:'NanumHumanHeavy'; 
 }  

/* size */
:root {  
 --won:100px;
 --mxwid:1312px;
 --widver:calc((100% - 1280px) / 2);
}
 
/* top nav */ 
.fix { position:fixed;top:25px;color:#000;transition:0.8s;}
.overflowY {overflow-y:hidden;} 
header {position:absolute;top:40px;left:50%;transform:translateX(-50%);display:flex;justify-content:center;align-items:center;width:100%;height:80px;max-width: 1312px;padding: 0 16px;z-index:15;box-sizing:border-box}
header .header-inner{width: 100%;display:flex;justify-content:end;align-items:center;background-color: #fff;height: 100%;border-radius: 20px;padding: 0 10px 0 40px;}
menu { width:100%; display:flex; justify-content:end; align-items:center; flex-wrap: nowrap; position:relative}   
menu >.gnb { display:flex;justify-content:space-between;}
menu >.gnb>li { position:relative; z-index:20; font-family:var(--fm2);text-align:center;}
menu >.gnb>li a { font-size:2rem; font-weight:700;color:#222;}
menu >.gnb>li>a.dep01 {display:inline-block;padding:15px 30px;transition:all ease 0.1s;}
menu >.gnb>li>a.dep01:hover{ color:var( --color1);}
menu >.gnb>li>.dep02{ pointer-events:none; opacity:0; transition:all ease 0.1s;position:absolute;left:50%;transform:translateX(-50%);top:50px;width:165px;background-color:var(--color1);box-shadow:0 5px 5px 0 rgba(0,0,0,0.1);border-radius:20px;padding:10px;}
menu >.gnb>li:hover>.dep02{ pointer-events:inherit;opacity:1;top:50px;}
menu >.gnb>li>.dep02>li { line-height:40px;}
menu >.gnb>li>.dep02>li a {font-size:2rem;font-weight:500;display:block;border-radius:10px;width:100%;line-height:40px;color:#fff;opacity:0.7;letter-spacing: -0.1rem;}
menu >.gnb>li>.dep02>li a:hover { opacity:1; background:rgba(0,0,0,0.5); transition:all ease 0.5s;} 
header .menu_mo {display:none}
header .menu_mo .gnb { display:none}
header .logo { line-height:1}

.inputFormTitleFont{
	font-family: var(--fm2);
    font-weight: 700;
    color: var(--color2);
    font-size: 2.0rem;
}

@media  (max-width:1204px) {  
menu >.gnb>li>a.dep01  {padding:15px 20px}
} 
@media (max-width:991px) { 
header {position:unset;transform: none;max-width: none;border-radius: 0;height: 80px;padding: 0 16px;}
header .header-inner { padding:0}
header .menu_mo {position:relative ;top: 0; left: 0;}
menu>.gnb { display:none}  /* pc 메뉴 off */ 
header .menu-btn {position:absolute;font-size:0;width: 28px;height: 19px;z-index:20;right: 0;}
header .menu-btn span {display:block;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width: 90%;height: 2px;background-color: #0083a7;}
header .menu-btn span::before {content:'';display:block;position:absolute;top: calc(50% - 8px);left:50%;transform:translate(-50%,-50%);width:100%;height: 2px;background-color:#0083a7;}
header .menu-btn span::after {content:'';display:block;position:absolute;top: calc(50% + 8px);left:50%;transform:translate(-50%,-50%);width: 100%;height: 2px;background-color:#0083a7;}
header .menu-btn.on span {background: transparent;} 
header .menu-btn.on span::before{ transform: rotate(45deg); top:0; left:0; background-color:#fff;}
header .menu-btn.on span::after { transform: rotate(-45deg); top:0; left:0; background-color:#fff;}  
header .menu_mo  {position:relative; top:0; left:auto; right:0; max-width:415px; width:100%; height:100%; background:var(--color1);z-index:18} /* mobile 메뉴시작 */
header .menu_mo .gnb {width:100%;height:100%;font-family: var(--fm400);padding: 50px 22px;box-sizing:border-box}
header .menu_mo .gnb>li:not(:first-child){ margin-top:30px}  
header .menu_mo .gnb>li { width:100% }
header .menu_mo .gnb>li>a.dep01 {font-size: 2.2rem;color:#fff; font-weight:600}
header .menu_mo .gnb>li>.dep02::before {position: absolute;content:'';display:block;height: 50%;width: 6px;background-color:#fff;bottom: 10px;left: 6px;z-index: 1;}
header .menu_mo .gnb>li>.dep02 {display:flex;flex-wrap:wrap;border-radius: 8px;background:#fff;padding: 10px 15px;box-sizing: border-box;margin-top:5px;height: 100%;position: relative;} 
header .menu_mo .gnb>li>.dep02 li{position:relative;padding-right: 16px;} 
header .menu_mo .gnb>li>.dep02 li:before{content:'';display:inline-block;position:absolute;top:50%;transform:translateY(-50%);left: -7px;width: 1px;height:50%;background-color:#ccc} 
header .menu_mo .gnb>li>.dep02 li:first-child:before{content:none;}
header .menu_mo .gnb>li>.dep02 li a {font-size: 1.8rem;font-weight: 400;line-height: 1.6;}
header .menu_mo.open { display:block; position:fixed;}
header .menu_mo.open .gnb { display:block;} 
}

@media (max-width:750px) {
header {height: 61px;}
header .logo img{max-width:226px;}	 
header .menu_mo .gnb>li>a.dep01 { font-size:1.9rem}
header .menu_mo .gnb>li>.dep02 li a {font-size:1.5rem;}
header .menu_mo .gnb>li:not(:first-child) { margin-top:15px}
}
@media (max-width:321px) {  
header .menu_mo .gnb>li>a.dep01 { font-size:1.6rem;} 
header .menu_mo .gnb>li>.dep02{margin-top:5px; padding:10px 0 10px 14px;}
header .menu_mo .gnb>li>.dep02 li { padding-right:14px;}
header .menu_mo .gnb>li>.dep02 li a { font-size:1.35rem}
header .menu_mo .gnb>li:not(:first-child) { margin-top:12px;}
header .menu_mo .gnb>li>.dep02 li:before {left:-6px}
header .menu_mo .gnb>li>.dep02::before {left:0; width:10px}
} 
/*top botton*/
.topbtn { display:none !important; border:1px solid #ccc;background-color:#efefef;width:40px;height:40px;position:fixed;right:15px;bottom:15px;z-index:15 }
.topbtn span { display:block;font-size:3.0rem;line-height:30px;transform:rotate(-90deg);transform-origin:center;opacity:0.5 }

/* footer */
footer { min-height:180px;width:100%;margin:0 auto;padding:40px 0;border-top:1px solid var(--line1);background-color:#fff;box-sizing:border-box}  
footer .inner {display:grid;grid-template-columns: 50% auto;}  
footer .leftbox .info li {font-size:1.8rem; font-family:var(--fm300); color:#636363; letter-spacing:-0.1px} 
footer .leftbox .info li span { font-size:inherit; font-weight:inherit;letter-spacing:inherit; display:inline-block;margin-right:20px} 
footer .rightbox {display:flex;flex-flow:column;justify-content:flex-end; grid-column: 2 / span 1; grid-row: 1 / span 2;}
footer .rightbox :is(.sns,.public){display:flex;justify-content:flex-end;align-items:flex-end;} 
footer .rightbox :is(.sns,.public) li { margin-left:0}
footer .rightbox .public {margin-top:30px;flex-wrap: wrap;} 
footer .rightbox .public li{margin-left:22px; height:33px;}  
footer .rightbox .public li a img { height:100%}
footer .copyright {margin-top: 30px;color:#999}
@media (max-width:991px) {  
footer{padding: 30px 0;}
footer .inner {display:flex;flex-flow:column;}  
footer .rightbox .public li{ margin-left:0; margin-right:15px;} 
footer .rightbox .sns { margin-left:-15px}  
}

@media (max-width:750px) {  
footer{padding: 30px 0;}
footer .inner {display:flex;flex-flow:column;}
footer .leftbox .info li { line-height:1.6; font-size:1.3rem}
footer .leftbox .info li span { display:block; margin-right:0}
footer .rightbox :is(.sns,.public){justify-content:flex-start;}
footer .rightbox .public li{ margin-left:0; margin-right:15px;} 
footer .rightbox .sns { margin-left:-15px} 
footer .copyright { font-size:1.3rem;}
}
 
/* 관리자 메뉴 */
#adminWrap + header {top:60px}
#adminWrap { position:absolute; top:0; left:50%; transform:translateX(-50%); width:100%; max-width:1280px; margin:0 auto; height:40px; z-index:16; display:flex;justify-content:end}
#adminWrap .admin-box {position:absolute;right:16px;top:0;background: var(--color2);width: 200px;box-shadow: rgb(0 0 0 / 16%) 0 4px 5px;border-radius:0 0 11px 11px;padding: 0 18px;display:flex; justify-content: space-between;align-items: center;} 
#adminWrap .admin-box .ad_link{ position:relative; width:96px; cursor:pointer}
#adminWrap .admin-box .ad_link::after {content:'';display:inline-block; width: 16px;height:10px;background:url(/ktobiz/souvenir/images/icon/ic_arrow_down_blue.svg) no-repeat center;position: absolute;right: 0;top: 50%; transform:translateY(-50%) scale(1);}
#adminWrap .admin-box .ad_link.on::after {transform:translateY(-50%) scale(-1);} 
#adminWrap .admin-box .ad_link a{ display:block;color:#fff; font-size:1.6rem; padding: 10px 0;} 
#adminWrap .admin-box .ad_link + .toglbx { display:none; padding:15px; border:1px solid #407887; background-color:#fff;box-shadow: rgb(0 0 0 / 16%) 0 4px 5px; position:absolute; top:47px; left:0; border-radius:11px;width:100%; box-sizing:border-box}
#adminWrap .admin-box .ad_link + .toglbx li { font-size:1.6rem; line-height:170%; padding-left:10px; position:relative; color:var(--color2)} 
#adminWrap .admin-box .ad_link + .toglbx li:before { content: ''; display: block; position: absolute; top:10px; left:0; width:3px; height:3px; background-color:#339cb9;} 
#adminWrap .loginot {display:block;font-size: 1.4rem;line-height:1;color:#fff;padding:10px 0;}

@media (max-width:991px) { 
#adminWrap + header {top:auto}
#adminWrap { position:absolute; top:90px; left:auto; transform:none;}
#adminWrap .admin-box { right:15px; border-radius:7px; width:200px; padding:0 13px} 
#adminWrap .admin-box .ad_link::after { right:5px} 
}
 
@media (max-width:750px) {
#adminWrap { top:70px; }
#adminWrap .admin-box { width:180px;}     
#adminWrap .admin-box .ad_link a{font-size:1.5rem;}  
#adminWrap .admin-box .ad_link + .toglbx li { font-size:1.4rem; }
}