html{overflow:auto}
body{background:#fff}

*::placeholder { color:#999; }                     
*::-webkit-input-placeholder { color:#999; }
*:-moz-placeholder { color:#999; }             
*::-moz-placeholder { color:#999; }           
*:-ms-input-placeholder { color:#999 !important; }      
*::-ms-input-placeholder { color:#999; } 

#wrap {width:100%; min-width:1200px;}
#header, #mainVisual, #subVisual, #container, #foot2024{width:100%; position:relative;}
.inner {width:1200px; margin:0 auto; position:relative;}
.inner:after {display:block; content:""; clear:both;}
.tb {display:table; width:100%;}
.tbc {display:table-cell;}

/*header*/
#header {position:fixed; top:0; left:0; width:100%; min-width:1200px; height:100px; background:#fff; border-bottom:1px solid rgba(255,255,255,0.2); z-index:100;}
.headerWrap { position:relative; height:100px; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -o-transition: all 0.5s ease; transition: all 0.5s ease;}
.headerWrap h1 {float:left; margin-top:10px;}
.headerWrap h1 a {position:relative; display:block; width:204px; height:50px;}
.headerWrap h1 img { position:absolute; top:0; left:0; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -o-transition: all 0.5s ease; transition: all 0.5s ease;}
.headerWrap h1 img.logo_w {opacity: 1; filter:alpha(opacity=1); -mox-opacity:1;}
.headerWrap h1 img.logo {opacity: 0; filter:alpha(opacity=0); -mox-opacity:0;}

#header.fixed,
#header:hover {border-color:#1c425d;}
#header.fixed {-webkit-box-shadow: 4px 4px 15px 0px rgba(0, 0, 0, 0.3); -moz-box-shadow:4px 4px 15px 0px rgba(0, 0, 0, 0.3); box-shadow:4px 4px 15px 0px rgba(0, 0, 0, 0.3);}
#header.fixed .headerWrap,
#header:hover .headerWrap {background:#fff;}
#header.fixed .headerWrap h1 img.logo_w,
#header:hover .headerWrap h1 img.logo_w {opacity: 0; filter:alpha(opacity=0); -mox-opacity:0;}
#header.fixed .headerWrap h1 img.logo,
#header:hover .headerWrap h1 img.logo {opacity: 1; filter:alpha(opacity=1); -mox-opacity:1;}

/* GNB */
#topmenu {position:absolute; top:0; right:0;}
#topmenu .gnb:after {display:block; content:""; clear:both;} 
#topmenu .gnb > li {position:relative; float:left; width:150px;}
#topmenu .gnb > li > a {position:relative; display:block; padding:50px 0 30px; font-size:18px; color:#000; text-align:center; line-height:20px; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -o-transition: all 0.5s ease; transition: all 0.5s ease;}
#topmenu .gnb > li > a:after {content:''; position:absolute; left:50%; bottom:-1px; width:0; height:3px; background:#4049cc; transform:translateX(-50%); -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -o-transition: all 0.5s ease; transition: all 0.5s ease;}
#topmenu .gnb > li > a span {display:block; font-size:12px; font-weight:300; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -o-transition: all 0.5s ease; transition: all 0.5s ease;}
#topmenu .gnb > li > a.on:after,
#topmenu .gnb > li:hover > a:after {width:100%;}

#topmenu .submenu {display:none; position:absolute; top:101px; left:0; width:100%; background:#fff; -webkit-box-shadow: 11px 11px 15px 0px rgba(0, 0, 0, 0.3); -moz-box-shadow:11px 11px 15px 0px rgba(0, 0, 0, 0.3); box-shadow:11px 11px 15px 0px rgba(0, 0, 0, 0.3); box-sizing:border-box;}
#topmenu .m1 .submenu { }
#topmenu .m2 .submenu {width:180px;}
#topmenu .m3 .submenu { width:180px;}
#topmenu .m5 .submenu { }
#topmenu .submenu li {position:relative; line-height:50px; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -o-transition: all 0.5s ease; transition: all 0.5s ease;}
#topmenu .submenu li a {display:block; padding:10px 20px; font-size:14px; font-weight:300; color:#222; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -o-transition: all 0.5s ease; transition: all 0.5s ease;}
#topmenu .submenu > ul > li:hover {background:#4049cc; color:#fff;}
#topmenu .submenu > ul > li:hover > a {color:#fff;}
#topmenu .submenu li .depth2 {background:url('/images/common/gnb_depth_off.png') no-repeat; background-position:calc(100% - 20px) center;}
#topmenu .submenu li:hover .depth2 {background-image:url('/images/common/gnb_depth_on.png');}
#topmenu .submenu li .depth3 {display:none; position:absolute; top:0; left:380px; width:210px; background:rgba(0,0,0,0.8); -webkit-box-shadow: 11px 11px 15px 0px rgba(0, 0, 0, 0.3); -moz-box-shadow:11px 11px 15px 0px rgba(0, 0, 0, 0.3); box-shadow:11px 11px 15px 0px rgba(0, 0, 0, 0.3);}
#topmenu .submenu li .depth3 li {-moz-transition: all 0.5s ease; -o-transition: all 0.5s ease; transition: all 0.5s ease;}
#topmenu .submenu li .depth3 li a {padding:0 20px; color:#fff;}
#topmenu .submenu li .depth3 li:hover {background:#4049cc;}

#header.fixed #topmenu > ul > li > a,
#header:hover #topmenu > ul > li > a {color:#222;}
#header.fixed #topmenu > ul > li > a span,
#header:hover #topmenu > ul > li > a span {color:#666;}

/* quick menu */
#quick {position:fixed; top:60px; right:30px; z-index:200;}
#quick ul li {margin-top:6px;}
#quick ul li:first-child {margin-top:0;}
#quick ul li a {display:block; /* border-radius:100%; -webkit-box-shadow: 1px 1px 8px 0px rgba(0, 0, 0, 0.3); -moz-box-shadow:1px 1px 8px 0px rgba(0, 0, 0, 0.3); box-shadow:1px 1px 8px 0px rgba(0, 0, 0, 0.3); */}
#quick ul li > a {position:relative; display:block;  font-size:18px; color:#fff;  }

 
#quick .fixed ul > li > a,
#quick :hover  ul > li > a {color:#222;}
 

/* TabStyle */
.TabType01 {margin-bottom:40px; text-align:center;}
.TabType01 ul {display:inline-block; padding:6px; border:1px solid #ddd; background:#efefef; text-align:center; font-size:0; border-radius:30px;}
.TabType01 ul li {display:inline-block; font-size:18px; vertical-align:top;}
.TabType01 ul li span {display:block; height:46px; padding:0 52px; font-weight:500; color:#555; line-height:46px; border-radius:25px; cursor:pointer; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -o-transition: all 0.5s ease; transition: all 0.5s ease;}
.TabType01 ul li.on span {background:#4049cc; color:#fff;}

.TabType02 {margin-bottom:50px;}
.TabType02 ul {text-align:center; font-size:0;}
.TabType02 ul li {display:inline-block; margin:0 2.5px 10px 0; border:1px solid #ddd; background:#efefef; font-size:18px; font-weight:400; border-radius:25px; overflow:hidden;}
.TabType02 ul li a {display:block; height:44px; padding:0 22px; line-height:44px;}
.TabType02 ul li.active {border-color:#4049cc; background:#4049cc;}
.TabType02 ul li.active a {color:#fff;}