@charset "utf-8"; /* CSS Document */ .box1{ width:1200px; margin:0 auto} .box2{ width:1400px; margin:0 auto} /**/ #loading{ position:fixed; width:300px; height:100px; margin:-50px 0 0 -110px; left:50%; top:50%; z-index:10000; text-align:center; display:none;} #loading .xi{color:#00437b; font-size:4em} #loading .tt{ background:#00437b; font-size:.813em; color:#fff; padding:10px; border-radius:10px; margin-top:10px} #loading_api{ position:fixed; width:300px; height:100px; margin:-50px 0 0 -110px; left:50%; top:50%; z-index:10000; text-align:center; display:none;} #loading_api .xi{color:#00437b; font-size:4em} #loading_api .tt{ background:#00437b; font-size:.813em; color:#fff; padding:10px; border-radius:10px; margin-top:10px} .loading_in{ text-align:center; padding:20px 0} .loading_in .xi{ font-size:1.5rem; color:#005aa6} .loading_in .tt{ display:block; font-size:.75rem; color:#333; margin-top:10px} /*header*/ #header{ background:#fff; position: absolute; z-index:100; top:0; left:0; width:100%; text-align:right; box-shadow:0 0 2px rgba(0,0,0,0.2)} #header .box1{ position:relative;} #header .logo{ position:absolute; left:0; top:0; height:100%; z-index:1} #header .logo img{ width:180px} #header .home_wrap{} #header .home_wrap .home_menu{ padding:10px 0 5px 0;} #header .home_wrap .home_menu > li{ display:inline-block; *display:inline; zoom:1; vertical-align:middle;} #header .home_wrap .home_menu > li > a{ display:block; font-size:.750em; color:#999; font-weight:bold; filter:alpha(opacity=100); opacity:1; padding:10px 7px} #header .home_wrap .home_menu > li > a:hover{ filter:alpha(opacity=80);opacity:0.8;} #header .home_wrap .home_menu > li.zoom{ margin-left:5px;} #header .home_wrap .home_menu > li.zoom ul{ font-size:0px;} #header .home_wrap .home_menu > li.zoom ul li{ display:inline-block; border:1px solid #ccc; font-size:11px; padding:5px 8px;} #header .home_wrap .home_menu > li.zoom .tm{ border-top-left-radius:3px; border-bottom-left-radius:3px; background:#f5f5f5; color:#666;} #header .home_wrap .home_menu > li.zoom .pm{ border-left:none; border-top-right-radius:3px; border-bottom-right-radius:3px; background:#ffff; color:#999; padding:5px 6px 2px 6px; vertical-align:bottom;} #header .home_wrap .home_menu > li.zoom .pm ul{ display:inline-block; *display:inline; zoom:1; overflow:hidden; vertical-align:top; margin-left:2px;} #header .home_wrap .home_menu > li.zoom .pm ul li{ float:left; padding:0 0 2px 0; border:none; margin-left:2px;} #header .home_wrap .home_menu > li.zoom .pm ul li:first-child{ margin-left:0px;} #header .home_wrap .home_menu > li.zoom .pm ul li a{ display:block; width:16px; height:14px; background-repeat:no-repeat; white-space:nowrap; text-indent:9999px; line-height:0;} #header .home_wrap .home_menu > li.zoom .pm ul li a.font_up{ background:url(../images/inc/plus.png);} #header .home_wrap .home_menu > li.zoom .pm ul li a.font_default{ background:url(../images/inc/default.png);} #header .home_wrap .home_menu > li.zoom .pm ul li a.font_down{ background:url(../images/inc/minus.png);} #header .lang_wrap{ display:inline-block; *display:inline; zoom:1; vertical-align:top; font-size:0; margin-left:10px;} #header .lang_wrap > li{ display:inline-block; *display:inline; zoom:1;} #header .lang_wrap > li > a{ position:relative; display:block; font-size:0.75rem; font-weight:bold; color:#0065ab; background:#fff; padding:0px 12px; height:22px; line-height:22px; text-decoration:none!important; border:1px solid #0065ab} #header .lang_wrap > li > a:hover{background:#f5f5f5;} #header .lang_wrap > li:first-child a{} #header .lang_wrap > li > a:hover{ text-decoration:underline;} #header .lang_wrap > li.on > a{ color:#fff; background:#0065ab;} #header .menu_wrap{ font-family:notokrM,sans-serif; letter-spacing:-1px;} #header .gnb_wrap{ display:inline-block; *display:inline; zoom:1; vertical-align:top; padding-top:10px;} #header .gnb_wrap .gnb .dp3 > li > a, #header .gnb_wrap .gnb .m_mypage, #header .gnb_wrap .gnb .m_member, #header .gnb_wrap .gnb .m_guide, #header .gnb_wrap .gnb .dp4{ display:none;} #header .gnb_wrap .gnb{ *zoom:1; margin-right:-33px} #header .gnb_wrap .gnb:after{ content:""; display:block; clear:both;} #header .gnb_wrap .gnb > li{ float:left; position:relative; z-index:inherit;} #header .gnb_wrap .gnb .dp1{ position:relative; display:block; font-size:1.25em; color:#333; padding:0 33px 25px 33px;} #header .gnb_wrap .gnb .dp1 .icon{ position:absolute; left:50%; bottom:0; width:0; height:2px; background:#005aa6; transition:.3s;} #header .gnb_wrap .gnb > li:hover .dp1, #header .gnb_wrap .gnb > li.on .dp1{ color:#005aa6;} /*#header .gnb_wrap .gnb > li:hover .dp1 .icon{ margin-left:-40%; width:80%;}*/ #header .gnb_wrap .gnb > li .dp2{ visibility:hidden; opacity:0; position:absolute; left:50%; border:1px solid #eee; background:#fff; width:200px; margin-left:-100px; text-align:center} #header .gnb_menu:before{ content:""; position:absolute; left:50%; top:0; width:2000px; margin-left:-1000px; height:100%; background:#fff; box-shadow:0 2px 4px rgba(0,0,0,.1); border-bottom:1px solid #ccc; border-top:1px solid #eee} #header .gnb_menu{position:absolute; top:108px; left:0; width:100%; background:#fff; opacity:0; visibility:hidden; transition:.3s} #header .gnb_menu.on{ opacity:1; visibility:visible} #header .gnb_menu .gnb{overflow:hidden;} #header .gnb_menu .gnb > li.m_info .dp3, #header .gnb_menu .gnb .dp4{ display:none} #header .gnb_menu .gnb > li{float:left; width:16.66%; text-align:left; position:relative; border-top:1px solid #eee} #header .gnb_menu .gnb > li::before{content:''; position:absolute; right:0; top:0; width:1px; height:100%; background:#eee;} #header .gnb_menu .gnb > li:first-child::after{content:''; position:absolute; left:0; top:0; width:1px; height:100%; background:#eee;} #header .gnb_menu .gnb > li .dp1{padding:20px 20px; display:block; font-size:.938em; font-weight:600; color:#005aa6;} #header .gnb_menu .gnb > li .dp1:before, #header .gnb_menu .gnb > li .dp1:after{ content:""; position:absolute; width:0; top:-1px; height:1px; background:#005aa6; transition:.3s} #header .gnb_menu .gnb > li .dp1:before{ left:50%} #header .gnb_menu .gnb > li .dp1:after{ right:50%} #header .gnb_menu .gnb > li:hover .dp1:before, #header .gnb_menu .gnb > li:hover .dp1:after{ right:50%; width:50%} #header .gnb_menu .gnb > li:hover{ background:#f9f9f9} #header .gnb_menu .gnb .dp2{ padding:2px 0 20px 0} #header .gnb_menu .gnb .dp2 > li{} #header .gnb_menu .gnb .dp2 > li > a{ display:block; font-size:0.813em; color:#666; position:relative; padding:4px 30px;} #header .gnb_menu .gnb .dp2 > li > a::before{content:''; position:absolute; left:18px; top:13px; width:2px; height:2px; background:#777;} #header .gnb_menu .gnb .dp2 > li:hover > a{color:#222; font-weight:600;} #header .gnb_menu .gnb .dp3{ padding:0 0 4px 0} #header .gnb_menu .gnb .dp3 > li > a{ display:block; font-size:.75em; color:#888; padding:3px 30px} #header .gnb_menu .gnb .dp3 > li > a:before{ content:"-"; padding-right:3px} #header .gnb_menu .gnb .dp3 > li:hover > a{color:#222; font-weight:600;} #header .gnb_menu .gnb > li.m_info{ background:#fafdff} #header .gnb_menu .gnb > li.m_info > a{ background:#005aa6; color:#fff; text-align:center} #header .gnb_menu .gnb > li.m_info .dp2 > li > a{ margin-top:5px; padding-left:28px} #header .gnb_menu .gnb > li.m_info .dp2 > li > a::before{ top:50%; width:4px; height:4px; background:#ccc; transition:.3s} #header .gnb_menu .gnb > li.m_info .dp2 > li:hover > a::before{ background:#005aa6} #header .gnb_menu .gnb .m_mypage, #header .gnb_menu .gnb .m_member, #header .gnb_menu .gnb .m_guide{ display:none;} .gnb .twrap{ display:none} #header .gnb_menu .gnb .twrap{ display:block; padding:15px} #header .gnb_menu .gnb .twrap:before{ content:""; position:absolute; right:0; bottom:0; width:100%; height:100%; background:url(../images/subN/1_5_symbolmark.svg) no-repeat right bottom; background-size:70px auto; opacity:.1; display:none} #header .gnb_menu .gnb .twrap .tit{ margin-bottom:30px} #header .gnb_menu .gnb .twrap .tit .t1{ color:#005aa6; font-size:.813em} #header .gnb_menu .gnb .twrap .tit .t2{ color:#005aa6; font-weight:bold; font-size:.938em; letter-spacing:-1px; margin-top:3px} #header .gnb_menu .gnb .twrap .tt{ margin-bottom:30px} #header .gnb_menu .gnb .twrap .tt .t1{ color:#00a3dd; font-size:.813em; font-weight:bold} #header .gnb_menu .gnb .twrap .tt .t2{ color:#555; font-size:.75em; margin-top:5px; line-height:1.5} #header .gnb_menu .gnb .twrap .btn *{ transition:.3s} #header .gnb_menu .gnb .twrap .btn > a{ display:block; position:relative; overflow:hidden; line-height:35px; background:#00a3dd; text-align:center; font-weight:bold; color:#fff; font-size:.813em; padding-right:30px; border-radius:35px} #header .gnb_menu .gnb .twrap .btn > a .xi{ position:absolute; right:0; top:0; width:30px; text-align:center; font-size:1.125em} #header .gnb_menu .gnb .twrap .btn > a:hover{ padding-right:40px} #header .gnb_menu .gnb .twrap .btn > a:hover .xi{ right:10px } #header .top_banner{ background: linear-gradient(90deg, #004a9e 0%, #29bfd0 30%, #29bfd0 70%, #004a9e 100%);} #header .top_banner .flex{ display:flex; height:2.5em; justify-content:space-between; align-items:center} #header .top_banner .flex .mark{ height:1.25em} #header .top_banner .flex .tit{ font-family:notokrB, sans-serif; color:#fff; letter-spacing:-1px; word-spacing:3px; font-size:1.063em} #header .top_banner .flex .more{ display:inline-block; color:#fff; font-size:.813em; font-weight:bold} #header .top_banner .flex .more .arrow{ margin:0 0 0 .5em; font-size:1.75em; text-shadow:-2px 2px 5px rgba(0,0,0,.2); vertical-align:middle; transition:.3s} #header .top_banner .flex .more .tt{ vertical-align:middle} #header .top_banner .flex .more:hover .arrow{ transform:rotate(360deg)} #header .top_banner .flex .more:hover .tt{ text-decoration:underline} #header .menu_wrap{ position:relative} #header .menu_wrap .mc_banner{ position:absolute; right:-180px; bottom:1em} #header .menu_wrap .mc_banner > a{ display:block} #header .menu_wrap .gnb .point .dp1{ color:#004a9e; position:relative} #header .menu_wrap .gnb .point .dp1 .mark:before, #header .menu_wrap .gnb .point .dp1 .mark:after, #header .menu_wrap .gnb .point .dp1 .mark .cir{ content:""; position:absolute; left:50%; top:-2.125em; width:1em; height:1em; border-radius:100%; text-align:center; background:#29bfd0; font-size:.25em} #header .menu_wrap .gnb .point .dp1 .mark:before{ margin-left:-1.875em} #header .menu_wrap .gnb .point .dp1 .mark:after{ margin-left:.75em} #header .menu_wrap .gnb .point .dp1 .mark .cir{ margin-left:-.5em; background:#abd900} #header .gnb_menu .gnb .point{ background:#f2f4f9} #header .gnb_menu .gnb .point:hover{ background:#e9ecf4} #header .gnb_menu .gnb .point .dp1{ position:relative} #header .gnb_menu .gnb .point .dp1 .mark{ position:absolute; left:-.375em; top:-.438em} #header .gnb_menu .gnb .point .dp1 .mark:before{ content:"\ea1c"; font-size:1.5em} #header .gnb_menu .gnb .point .dp1 .mark:after{ content:"\ea0f"; font-family:xeicon!important; position:absolute; left:1.25em; top:1.125em; font-size:.438em; color:#ffd800} /* #header .gnb_menu .gnb .dp2 > li.spoint > a{ font-weight:bold; color:#111} */ #header .gnb_menu .gnb .dp2 > li.spoint > a{ color:#005aa6;} /* #header .gnb_menu .gnb .dp2 > li.spoint > a:before{ content:"\ea0f"; font-family:xeicon!important; background:none; font-size:.75em; top:6px; left:15px; color:#29bfd0; animation-name: blinkAni; animation-duration: 1.5s; animation-iteration-count: infinite} */ #header .gnb_menu .gnb .dp2 > li.spoint.st2 > a{ position:relative; color:#004a9e;} #header .gnb_menu .gnb .dp2 > li.spoint.st2 > a:after{ content:""; position:absolute; left:.50em; top:1px; height:100%; width:calc(100% - 7em); background:#dce1ed; border-radius:5em} /*#header .gnb_menu .gnb .dp2 > li.spoint.st2 > a:after{ content:""; position:absolute; left:.5em; top:1px; height:100%; width:calc(100% - 1em); background:#dce1ed; border-radius:5em} */ #header .gnb_menu .gnb .dp2 > li.spoint.st2 > a:before{ z-index:1} #header .gnb_menu .gnb .dp2 > li.spoint.st2 > a > span{ position:relative; z-index:1} @keyframes blinkAni{ 25% {opacity:0} 75% {opacity:1} } #header .gnb_menu .gnb .dp2 > li.soon{ position:relative} #header .gnb_menu .gnb .dp2 > li.soon:after{ content:"준비중"; position:absolute; right:.75em; top:.25em; font-size:.688em; padding:.25em 1em .313em 1em; background:#dce1ed; color:#004a9e; border-radius:5em} #header.st2 .menu_wrap .gnb .point .dp1{ font-size:0; background-repeat:no-repeat; background-position:center top; width:110px; height:50px; padding:0; padding-left:10px; margin-top:-17px} #header.st2.f1 .menu_wrap .gnb .point .dp1{ background-image:url(../images/inc/gnb_mc_a.png)} #header.st2.f2 .menu_wrap .gnb .point .dp1{ background-image:url(../images/inc/gnb_mc_b.png)} #header.st2.f3 .menu_wrap .gnb .point .dp1{ background-image:url(../images/inc/gnb_mc_c.png)} #header.st2.f4 .menu_wrap .gnb .point .dp1{ background-image:url(../images/inc/gnb_mc_d.png)} #header.st2.f5 .menu_wrap .gnb .point .dp1{ background-image:url(../images/inc/gnb_mc_e.png?v=1)} #header.st2 .menu_wrap .gnb .point .dp1 .mark .cir{ display:none} #header.st3 .menu_wrap .gnb .point .dp1{ padding-left:3em} /* #header.st3 .menu_wrap .gnb .point .dp1 .mark:before{ content:"\eb8d"; background:none; width:auto; font-size:4em; left:2.438em; top:-.188em} */ #header.st3 .menu_wrap .gnb .point .dp1 .mark:before{ width:26px; height:26px; left:38px; top:-1px; background-repeat:no-repeat; background-position:center center; background-color: transparent !important; border-radius:0; background-size:contain} #header.st3 .menu_wrap .gnb .point .dp1 .mark:after{ display:none} #header.st3.i1 .menu_wrap .gnb .point .dp1 .mark:before{ background-image:url(../images/inc/gnb_mc_icon_a.png)} #header.st3.i2 .menu_wrap .gnb .point .dp1 .mark:before{ background-image:url(../images/inc/gnb_mc_icon_b.png)} #header.st3.i3 .menu_wrap .gnb .point .dp1 .mark:before{ background-image:url(../images/inc/gnb_mc_icon_c.png)} #header.st3 .menu_wrap .gnb .point .dp1 .mark .cir{ display:none} /*footer*/ #footer{} #footer .menu_wrap{ line-height:47px; border-bottom:1px solid #ccc; border-top:2px solid #3e3e3e} #footer .menu_wrap .menu{ overflow:hidden; float:left} #footer .menu_wrap .menu > li{ float:left;} #footer .menu_wrap .menu > li > a{ display:block; padding:0 10px; font-size:0.813em; font-weight:bold; color:#333} #footer .menu_wrap .menu > li:first-child > a{ padding-left:0;} #footer .menu_wrap .menu > li > a:hover{ text-decoration:underline} #footer .menu_wrap .gotop_btn{ float:right; padding:0 20px; border:1px solid #ccc; border-top:none; border-bottom:none} #footer .menu_wrap .gotop_btn .xi{ color:#aaa} #footer .menu_wrap .gotop_btn .tt{ color:#333; font-size:.813em; font-weight:bold; padding-left:5px} #footer .menu_wrap .gotop_btn:hover{ background:#f5f5f5} #footer .info_wrap{ padding:18px 0 40px 0; background:#fbfbfb} #footer .info_wrap .box1{ position:relative;} #footer .info_wrap .logo{ display:inline-block; *display:inline; zoom:1; vertical-align:middle} #footer .info_wrap .info{ display:inline-block; *display:inline; zoom:1; vertical-align:middle; margin:10px 0 0 50px} #footer .info_wrap .info .def{ display:inline-block; *display:inline; zoom:1; margin-right:30px; font-size:.813em; color:#666} #footer .info_wrap .info .en{ display:block; padding-top:10px; font-size:0.688em; letter-spacing:0; text-transform:uppercase; color:#aaa} /*contents*/ #contents{} #contents .svisual_wrap{ height:150px; background-repeat:no-repeat; background-position:center top; background-size:cover;} #contents .svisual_1{ background-image:url(../images/sub/sub_visual1.jpg);} #contents .svisual_2{ background-image:url(../images/sub/sub_visual2.jpg);} #contents .svisual_3{ background-image:url(../images/sub/sub_visual3.jpg);} #contents .svisual_4{ background-image:url(../images/sub/sub_visual4.jpg);} #contents .svisual_5{ background-image:url(../images/sub/sub_visual5.jpg);} #contents .svisual_info { background-image:url(../images/sub/sub_visual_info.jpg);} #contents .svisual_member{ background-image:url(../images/sub/sub_visual_member.jpg);} #contents .svisual_mypage{ background-image:url(../images/sub/sub_visual_member.jpg);} #contents .svisual_guide { background-image:url(../images/sub/sub_visual_member.jpg);} #contents .svisual_wrap .tt{ padding:121px 290px 0 0; text-align:center; font-family:Arial, sans-serif; font-size:1em; color:#999;} .nav_dv{width:100%; background:rgba(0,0,0,0.4);} .nav_dv .nav{ text-align:right; margin-top:-40px;} .nav_dv .nav > li{ display:inline-block; *display:inline; zoom:1; vertical-align:middle; font-size:0.813em; color:#ddd; height:40px; line-height:40px;} .nav_dv .nav > li:before{ content:"\e93f"; font-family:xeicon !important; font-style:normal; font-weight:normal; font-size:1.125em; color:#ccc; padding-right:2px; vertical-align:middle;} .nav_dv .nav > li:first-child:before{ display:none;} .nav_dv .nav > li.home{ font-size:.750em;} .nav_dv .nav > li.this{ color:#fff; font-weight:600;} #contents .sub_con{ position:relative; overflow:hidden; padding:0 0 50px 0} #contents .sub_con .con_Hst{ height:80px;} #contents .sub_con .lnb_area{ float:left; width:220px;} #contents .sub_con .con_area{ float:right; width:930px;} #contents .lnb_area{} #contents .lnb_area .lnb_tit{text-align:left; font-family:notokrR,sans-serif; font-size:1.625em; color:#111; font-weight:normal; letter-spacing:-1px; border-bottom:1px solid #ccc;} /*#contents .lnb_area .lnb_tit{ background:url(../images/inc/lnb_tit_bg.jpg) no-repeat 0 0; text-align:center; font-family:notokrM,sans-serif; font-size:1.250em; color:#fff; font-weight:normal; letter-spacing:-1px;}*/ #contents .lnb_area .lnb_tit .va_tt{position:relative;} #contents .lnb_area .lnb_tit .va_tt::before{} #contents .lnb_area .gnb{ background:url(../images/inc/lnb_off.jpg) left bottom; border-top:none; margin-bottom:100px;} #contents .lnb_area .gnb > li, #contents .lnb_area .gnb > li .dp1, #contents .lnb_area .gnb > li .dp4{ display:none;} #contents .lnb_area .gnb > li.on{ display:block} #contents .lnb_area .gnb .dp2 > li { border-bottom:1px solid #ddd;} #contents .lnb_area .gnb .dp2 > li > a{ position:relative; display:block; padding:15px 20px; font-family:notokrM, sans-serif; letter-spacing:-1px; font-size:1em; color:#555; transition:all 0.3s;} #contents .lnb_area .gnb .dp2 > li > a:after{ content:"\e93f"; font-family:xeicon !important; font-style:normal; font-weight:normal; font-size:1.125em; position:absolute; top:50%; right:15px; margin-top:-10px; color:#aaa} #contents .lnb_area .gnb .dp2 > li.soon > a{ position:relative} #contents .lnb_area .gnb .dp2 > li.soon > a:after{ content:"준비중"; position:absolute; right:.5em; top:50%; font-size:.688em; padding:.25em 1em .313em 1em; background:#dce1ed; color:#004a9e; border-radius:5em; font-family:notokrM, sans-serif !important; opacity:.8} #contents .lnb_area .gnb .dp2 > li.more > a:after{ content:"\e942"} #contents .lnb_area .gnb .dp2 > li:hover > a{ color:#005aa6; background:#f1f1f1} #contents .lnb_area .gnb .dp2 > li.on > a{ color:#fff; background:#005aa6} #contents .lnb_area .gnb .dp2 > li:hover > a:after{ color:#005aa6} #contents .lnb_area .gnb .dp2 > li.on > a:after{ color:#fff} #contents .lnb_area .gnb .dp2 > li:hover > .dp3, #contents .lnb_area .gnb .dp2 > li.on > .dp3{ background:#f9f9f9} #contents .lnb_area .gnb .dp2 > li .dp3{ border-top:1px solid #ddd; padding:10px 0} #contents .lnb_area .gnb .dp2 > li .dp3 > li{} #contents .lnb_area .gnb .dp2 > li .dp3 > li > a{ position:relative; display:block; font-size:0.875em; letter-spacing:-1px; color:#777; padding:10px 35px; font-family:notokrM, sans-serif} #contents .lnb_area .gnb .dp2 > li .dp3 > li > a:before{ content:"\e97e"; font-family:xeicon !important; position:absolute; left:20px; top:50%; margin-top:-6px; color:#aaa; font-size:.875em} #contents .lnb_area .gnb .dp2 > li .dp3 > li > a:after{ content:"\e93f"; font-family:xeicon !important; font-style:normal; font-weight:normal; font-size:1em; position:absolute; top:50%; right:15px; margin-top:-10px; color:#aaa; opacity:0} #contents .lnb_area .gnb .dp2 > li .dp3 > li.on > a, #contents .lnb_area .gnb .dp2 > li .dp3 > li:hover > a{ color:#111;} #contents .lnb_area .gnb .dp2 > li .dp3 > li.on > a:before, #contents .lnb_area .gnb .dp2 > li .dp3 > li:hover > a:before, #contents .lnb_area .gnb .dp2 > li .dp3 > li.on > a:after, #contents .lnb_area .gnb .dp2 > li .dp3 > li:hover > a:after{ color:#111; opacity:1} #contents .sub_con .con_area{} #contents .sub_con .con_area .con_tit_wrap{ position:relative; white-space: nowrap; border-bottom:1px solid #ccc; margin-bottom:25px} #contents .sub_con .con_area .con_tit_wrap .bg{ position:absolute; top:0; left:0; width:100%; height:100%;} #contents .sub_con .con_area .tit_area{ position:relative; width:100%} #contents .sub_con .con_area .tit_area h3{ } #contents .sub_con .con_area .tit_area h3 > strong{ font-family:notokrM,sans-serif; font-size:1.938em; color:#111; font-weight:normal; letter-spacing:-1px;} #contents .sub_con .con_area .doc_wrap{} #contents .doc.info_main{ padding:20px 0 30px 0} .sub_tt1{ font-size:.875em; color:#666; line-height:1.7; margin-top:30px} /**/ #contents .content_nav{ background:#f1f4f5; border-bottom:1px solid #e1e5e7; line-height:50px} #contents .content_nav .left{ float:left} #contents .content_nav .right{ float:right} #contents .content_nav .nav_wrap{ font-size:0} #contents .content_nav .nav_wrap > li{ display:inline-block; *display:inline; zoom:1; vertical-align:top; font-size:16px; font-size:1rem} #contents .content_nav .nav_wrap > li > a{ display:block} #contents .content_nav .nav_wrap li.all > a{ width:50px; background:#0065ab; color:#fff; text-align:center; font-size:1.063em} #contents .content_nav .nav_wrap li.tt > a{ min-width:130px; padding:0 35px 0 15px; position:relative; z-index:20; font-size:.875em; color:#8f9698; font-weight:bold} #contents .content_nav .nav_wrap li.tt.dp4 > a{ min-width:180px} #contents .content_nav .nav_wrap li.tt > a:before{ content:""; position:absolute; right:-1px; top:0; width:1px; height:100%; background:#e1e5e7} #contents .content_nav .nav_wrap li.tt > a .arrow{ position:absolute; width:30px; text-align:center; right:0; top:0; transition:.3s} #contents .content_nav .nav_wrap li.tt > a .arrow:before{ content:"\e93f"} #contents .content_nav .nav_wrap li.tt:last-child > a .arrow{ transform:rotate(90deg)} #contents .content_nav .nav_wrap li.tt > a:hover, #contents .content_nav .nav_wrap li.tt.on > a{ color:#005aa6} #contents .content_nav .nav_wrap li.tt.on > a:before{ background:#fff; left:0; top:0; border-top:1px solid #005aa6} #contents .content_nav .nav_wrap li.tt:hover > a .arrow{ transform:rotate(90deg)} #contents .content_nav .nav_wrap li.tt.on > a .arrow{ transform:rotate(270deg)} #contents .content_nav .nav_wrap li.tt{ position:relative} #contents .content_nav .nav_wrap li.tt .gnb{ position:absolute; width:100%; right:0; padding-left:1px; z-index:10; background:#fff; opacity:0; visibility:hidden} #contents .content_nav .nav_wrap li.tt .gnb:before{ content:""; position:absolute; left:0; top:-50px; padding-top:50px; width:100%; height:100%; border:1px solid #005aa6; background:#fff; box-shadow:0 1px 3px rgba(0,0,0,.2)} #contents .content_nav .nav_wrap li.tt .gnb.on{ opacity:1; visibility:visible} #contents .content_nav .nav_wrap li.tt .gnb li a{ display:block; font-size:.813em; color:#666; padding:10px 30px 10px 15px; line-height:1.2; border-top:1px solid #e1e5e7; position:relative; overflow:hidden;} #contents .content_nav .nav_wrap li.tt .gnb li a:before{ content:"\e93f"; font-family:xeicon!important; width:30px; text-align:center; position:absolute; right:-30px; top:50%; margin-top:-8px; transition:.3s} #contents .content_nav .nav_wrap li.tt .gnb li.on > a, #contents .content_nav .nav_wrap li.tt .gnb li a:hover{ color:#111; background:#f9f9f9; font-weight:bold} #contents .content_nav .nav_wrap li.tt .gnb li.on > a:before, #contents .content_nav .nav_wrap li.tt .gnb li a:hover:before{ right:0} #contents .content_nav .nav_wrap li.tt.dp1 .gnb .dp2, #contents .content_nav .nav_wrap li.tt.dp2 .gnb > li, #contents .content_nav .nav_wrap li.tt.dp2 .gnb > li > a, #contents .content_nav .nav_wrap li.tt.dp2 .gnb .dp3, #contents .content_nav .nav_wrap li.tt.dp3 .gnb > li, #contents .content_nav .nav_wrap li.tt.dp3 .gnb .dp1, #contents .content_nav .nav_wrap li.tt.dp3 .gnb .dp2 > li, #contents .content_nav .nav_wrap li.tt.dp3 .gnb .dp2 > li > a, #contents .content_nav .nav_wrap li.tt.dp3 .gnb .dp4, #contents .content_nav .nav_wrap li.tt.dp4 .gnb > li, #contents .content_nav .nav_wrap li.tt.dp4 .gnb .dp1, #contents .content_nav .nav_wrap li.tt.dp4 .gnb .dp2 > li, #contents .content_nav .nav_wrap li.tt.dp4 .gnb .dp2 > li > a, #contents .content_nav .nav_wrap li.tt.dp4 .gnb .dp3 > li, #contents .content_nav .nav_wrap li.tt.dp4 .gnb .dp3 > li > a{ display:none} #contents .content_nav .nav_wrap li.tt .gnb li.on{ display:block !important} #contents .content_nav .font_wrap{ float:left; border-left:1px solid #e1e5e7; padding:0 20px} #contents .content_nav .font_wrap .tt, #contents .content_nav .font_wrap .btn{display:inline-block; *display:inline; zoom:1; vertical-align:middle;} #contents .content_nav .font_wrap .tt{ color:#8f9698; font-size:.75em; padding-right:5px; line-height:1} #contents .content_nav .font_wrap .btn{ overflow:hidden; padding-left:1px} #contents .content_nav .font_wrap .btn > li{ float:left} #contents .content_nav .font_wrap .btn > li > a{ display:block; width:22px; line-height:20px; height:20px; text-align:center; background:#fff; border:1px solid #ddd; font-size:.625em; margin-left:-1px; color:#777; position:relative} #contents .content_nav .font_wrap .btn > li > a.default .xi{ position:absolute; left:50%; top:50%; width:4px; height:4px; margin:-2px 0 0 -2px; border-radius:100%; background:#777; text-align:center;} #contents .content_nav .font_wrap .btn > li:hover > a{ background:#999; border-color:#999; color:#fff} #contents .content_nav .font_wrap .btn > li:hover > a.default .xi{ background:#fff} #contents .content_nav .print_btn{ float:left; width:50px; background:#11b0e9; text-align:center; color:#fff; font-size:.875em} #contents .content_nav_wrap.st_info{ background: url(../images/subN/info_nav_bg.jpg) no-repeat center top} #contents .content_nav_wrap.st_info .content_nav_tit{ text-align:center; color:#fff} #contents .content_nav_wrap.st_info .content_nav_tit .va_wrap{ height:110px} #contents .content_nav_wrap.st_info .content_nav_tit .t1{ font-family:notokrM, sans-serif; letter-spacing:-2px; font-size:1.813em} #contents .content_nav_wrap.st_info .content_nav_tit .t2{ font-size:.75em; opacity:.8; padding:10px 0 8px 0} #contents .content_nav_wrap.st_info .content_nav{ background:rgba(255,255,255,.1); border-bottom:none; border-bottom:1px solid rgba(255,255,255,.1); line-height:40px} #contents .content_nav_wrap.st_info .content_nav .nav_wrap li.all > a{ background:none; color:#fff; border:1px solid rgba(255,255,255,.1); border-top:none; border-bottom:none; width:40px; font-size:.938em} #contents .content_nav_wrap.st_info .content_nav .nav_wrap li.tt > a{ min-width:100px; font-size:.75em; color:#fff; font-weight:normal; opacity:.7} #contents .content_nav_wrap.st_info .content_nav .nav_wrap li.tt.dp4 > a{ min-width:180px} #contents .content_nav_wrap.st_info .content_nav .nav_wrap li.tt > a:before{ background:rgba(255,255,255,.1)} #contents .content_nav_wrap.st_info .content_nav .nav_wrap li.tt > a:hover{ color:#fff; opacity:1} #contents .content_nav_wrap.st_info .content_nav .nav_wrap li.tt .gnb::before{ padding-top:0; top:-1px; background:none; border-color:#001e50} #contents .content_nav_wrap.st_info .content_nav .nav_wrap li.on.tt > a:before{ left:auto; right:-1px} #contents .content_nav_wrap.st_info .content_nav .nav_wrap li.tt .gnb li a{ font-size:.75em} #contents .content_nav_wrap.st_info .content_nav .print_btn, #contents .content_nav_wrap.st_info .content_nav .font_wrap .tt{ display:none} #contents .content_nav_wrap.st_info .content_nav .font_wrap{ border-left:none; padding:0} #contents .content_nav_wrap.st_info .content_nav .font_wrap .btn > li > a{ line-height:40px; height:40px; width:40px; background:none; border-top:none; border-bottom:none; border-color:rgba(255,255,255,.1); color:#fff} #contents .content_nav_wrap.st_info .content_nav .font_wrap .btn > li > a.default .xi{ background:#fff} #contents .content_nav_wrap.st_info .content_nav .font_wrap .btn > li > a:hover{ background:rgba(0,0,0,.1)} #contents .content_nav_wrap.st_info .content_nav{ display:none} #contents .content_nav_wrap.st_info.navOn .content_nav{ display:block} #contents .content_nav_wrap.st_info .content_nav_tab{} #contents .content_nav_wrap.st_info .content_nav_tab .gnb > li, #contents .content_nav_wrap.st_info .content_nav_tab .gnb > li .dp1, #contents .content_nav_wrap.st_info .content_nav_tab .gnb > li .dp2 > li, #contents .content_nav_wrap.st_info .content_nav_tab .gnb > li .dp2 > li > a, #contents .content_nav_wrap.st_info .content_nav_tab .gnb > li .dp4{ display:none} #contents .content_nav_wrap.st_info .content_nav_tab .gnb > li.on, #contents .content_nav_wrap.st_info .content_nav_tab .gnb > li .dp2 > li.on{ display:block} #contents .content_nav_wrap.st_info .content_nav_tab .gnb .dp3{ font-size:0; } #contents .content_nav_wrap.st_info .content_nav_tab .gnb .dp3 > li{ display:inline-block; *display:inline; zoom:1; vertical-align:top; font-size:16px; font-size:1rem} #contents .content_nav_wrap.st_info .content_nav_tab .gnb .dp3 > li > a{ display:block; text-align:center; font-size:.938em; margin-right:-1px; font-weight:bold; position:relative} #contents .content_nav_wrap.st_info.st1 .content_nav_tab{ border-bottom:1px solid #ddd; background:#fff;} #contents .content_nav_wrap.st_info.st1 .content_nav_tab .gnb .dp3{ text-align:center} #contents .content_nav_wrap.st_info.st1 .content_nav_tab .gnb .dp3 > li > a{ text-align:center; padding:15px 30px; min-width:100px; color:#333} #contents .content_nav_wrap.st_info.st1 .content_nav_tab .gnb .dp3 > li > a:before{ content:""; position:absolute; left:0; top:50%; height:10px; margin-top:-5px; width:1px; background:#ccc} #contents .content_nav_wrap.st_info.st1 .content_nav_tab .gnb .dp3 > li > a:after{ content:""; position:absolute; width:100%; height:2px; left:0; bottom:-1px; background:#005aa6; opacity:0} #contents .content_nav_wrap.st_info.st1 .content_nav_tab .gnb .dp3 > li:first-child > a:before{ display:none} #contents .content_nav_wrap.st_info.st1 .content_nav_tab .gnb .dp3 > li.on > a{ color:#005aa6} #contents .content_nav_wrap.st_info.st1 .content_nav_tab .gnb .dp3 > li.on > a:after{ opacity:1} #contents .content_nav_wrap.st_info.st2{ position:relative} #contents .content_nav_wrap.st_info.st2 .content_nav{ display:block; width:100%; text-align:right; background:none; border:none; position:absolute; right:0; bottom:-55px; z-index:1} #contents .content_nav_wrap.st_info.st2 .content_nav .left{ float:right} #contents .content_nav_wrap.st_info.st2 .content_nav .right{ display:none} #contents .content_nav_wrap.st_info.st2 .content_nav .nav_wrap > li.all > a{ display:none} #contents .content_nav_wrap.st_info.st2 .content_nav .nav_wrap li.tt > a{ min-width: inherit; padding:0; color:#999; opacity:1; cursor:default} #contents .content_nav_wrap.st_info.st2 .content_nav .nav_wrap li.tt > a:after{ content:">"; padding:0 5px} #contents .content_nav_wrap.st_info.st2 .content_nav .nav_wrap li.tt:last-child > a:after{ display:none} #contents .content_nav_wrap.st_info.st2 .content_nav .nav_wrap li.tt > a .arrow{ display:none} #contents .content_nav_wrap.st_info.st2 .content_nav .nav_wrap li.tt > a:before{ display:none} #contents .content_nav_wrap.st_info.st2 .content_nav .nav_wrap li.tt .gnb{ display:none !important} #contents .content_nav_wrap.st_info.st2 .content_nav .nav_wrap > li.all:before{ content:"H >"; position:static; padding-right:5px; font-size:.75em; color:#999; opacity:1} #contents .content_nav_wrap.st_info.st2 .content_nav_tit{} #contents .content_nav_wrap.st_info.st2 .content_nav_tit .va_wrap{ height:80px; text-align:center} #contents .content_nav_wrap.st_info.st2 .content_nav_tit .btn > a{ display:block; margin-left:20px; padding:5px 12px 6px 15px; background:#005aa6; border-radius:35px; font-size:.875em; color:#fff; font-weight:bold;} #contents .content_nav_wrap.st_info.st2 .content_nav_tit .btn > a i{ display:inline-block; vertical-align:middle;} #contents .content_nav_wrap.st_info.st2 .content_nav_tit .btn > a .tt{ padding:0 6px;} #contents .content_nav_wrap.st_info.st2 .content_nav_tit .btn > a .xi{ margin-top:2px; font-size:1.063em;} #contents .content_nav_wrap.st_info.st2 .content_nav_tit .btn > a .icon{ position:relative; left:0; font-size:.938em; transition:.2s;} #contents .content_nav_wrap.st_info.st2 .content_nav_tit .btn > a:hover .icon{ left:.4em;} #contents .content_nav_wrap.st_info.st2 .content_nav_tab .gnb{ text-align:center } #contents .content_nav_wrap.st_info.st2 .content_nav_tab .gnb .dp3 > li{ width:20%} #contents .content_nav_wrap.st_info.st2 .content_nav_tab .gnb .sm_1 .dp3 > li{ width:14.2857%} #contents .content_nav_wrap.st_info.st2 .content_nav_tab .gnb .dp3 > li > a{ border-top:1px solid rgba(255,255,255,.2); color:#fff; padding:10px 0} #contents .content_nav_wrap.st_info.st2 .content_nav_tab .gnb .dp3 > li > a:before, #contents .content_nav_wrap.st_info.st2 .content_nav_tab .gnb .dp3 > li > a:after{ content:""; position:absolute; left:0; top:0; width:1px; height:100%; background:#fff; opacity:.1} #contents .content_nav_wrap.st_info.st2 .content_nav_tab .gnb .dp3 > li > a:after{ left:auto; right:0} #contents .content_nav_wrap.st_info.st2 .content_nav_tab .gnb .dp3 > li:first-child > a:before{ opacity:.2} #contents .content_nav_wrap.st_info.st2 .content_nav_tab .gnb .dp3 > li:nth-child(4) > a{ border-right:none} #contents .content_nav_wrap.st_info.st2 .content_nav_tab .gnb .dp3 > li:hover > a{ background:rgba(255,255,255,.1) !important;} #contents .content_nav_wrap.st_info.st2 .content_nav_tab .gnb .dp3 > li:not(.point).on > a{ background:#fff !important; color:#005aa6;} #contents .content_nav_wrap.st_info.st2 .content_nav_tab .gnb .dp3 > li.point > a{ background:#005aa6; color:#fff; margin-left:20px} #contents .content_nav_wrap.st_info.st2 .content_nav_tab .gnb .dp3 > li.tp1 > a{ background:#2b4ea7;} #contents .content_nav_wrap.st_info.st2 .content_nav_tab .gnb .dp3 > li.tp2 > a{ background:#005d8d;} #contents .page_tit_info{ border-bottom:1px solid #ddd; font-size:1.688em; font-weight:bold; color:#222; font-family:notokrM, sans-serif; letter-spacing:-2px; text-align:left; padding-left:10px; line-height:60px; height:60px; padding-top:5px} #contents .page_tab_wrap{ padding:20px 0 0 0} #contents .page_tab_wrap .gnb{} #contents .page_tab_wrap .gnb > li, #contents .page_tab_wrap .gnb > li .dp1, #contents .page_tab_wrap .gnb > li .dp2 > li > a, #contents .page_tab_wrap .gnb > li .dp3 > li, #contents .page_tab_wrap .gnb > li .dp3 > li > a{ display:none} #contents .page_tab_wrap .gnb > li.on, #contents .page_tab_wrap .gnb > li .dp3 > li.on{ display:block} #contents .page_tab_wrap .gnb .dp4{ font-size:0; padding-left:1px; position:relative} #contents .page_tab_wrap .gnb .dp4 > li{ display:inline-block; *display:inline; zoom:1; vertical-align:top; font-size:16px; font-size:1rem; min-width:33.33%; position:relative} #contents .page_tab_wrap .gnb .dp4 > li > a{ display:block; background:#fff; border:1px solid #ddd; text-align:center; font-size:0.875em; font-weight:600; line-height:40px; color:#888; margin-left:-1px; transition:.3s; position:relative} #contents .page_tab_wrap .gnb .dp4 > li:hover > a{background:#f5f5f5; color:#333;} #contents .page_tab_wrap .gnb .dp4 > li.on > a{ background:#fff;border-color:#444549; color:#333; z-index:1} #contents .page_tab_wrap .gnb .dp4 > li.on > a:before, #contents .page_tab_wrap .gnb .dp4 > li.on > a:after{ content:""; position:absolute; bottom:0; width:0; height:0; border-top: 30px solid rgba(0,0,0,.1)} #contents .page_tab_wrap .gnb .dp4 > li.on > a:before{ left:-16px; border-left: 15px solid transparent} #contents .page_tab_wrap .gnb .dp4 > li.on > a:after{ right:-16px; border-right: 15px solid transparent} #contents .page_tab_wrap .gnb .dp4:after{ content:""; position:absolute; left:0; bottom:0; width:100%; height:1px; background:#ddd} #contents .page_tab_wrap .gnb .dp4 > li.on:after{ content:""; position:absolute; left:0; bottom:0; width:100%; box-sizing: border-box; border-right:1px solid #333; height:1px; background:#fff; z-index:1} .testBtn{ position:fixed; left:30px; top:50%; margin-top:-70px; z-index:1000} .testBtn .list{ overflow:hidden; margin-top:15px} .testBtn .list > li{ float:left;} .testBtn .list > li > a{ display:block; width:70px; height:70px; border:1px solid #333; background:#fff; text-align:center; color:#777} .testBtn .list > li > a .t1{ display:block; font-size:.813em; font-weight:bold; padding-top:15px} .testBtn .list > li > a .t2{ font-size:1.25em} .testBtn .list > li.on > a{ background:#333; color:#fff} /*sub style inc*/ .page_sec0{ margin-top:0 !important} .page_sec { margin-top:30px} .page_sec1{ margin-top:20px !important;} .page_sec2{ margin-top:40px !important;} .page_sec3{ margin-top:60px !important;} .page_sec4{ margin-top:80px !important;} .tab_st1{ overflow:hidden; margin-bottom:30px; padding-left:1px; position:relative} .tab_st1 > li{ float:left; width:20%} .tab_st1.sec2 > li{ width:50%} .tab_st1.sec3 > li{ width:33.33%} .tab_st1.sec4 > li{ width:25%} .tab_st1.sec5 > li{ width:20%} .tab_st1.sec6 > li{ width:16.66%} .tab_st1.sec7 > li{ width:14.28%} .tab_st1.sec8 > li{ width:12.5%} .tab_st1 > li > a{ display:block; background:#fff; border:1px solid #ddd; text-align:center; font-size:0.875em; font-weight:600; height:40px; color:#888; margin-left:-1px; transition:.3s; position:relative} .tab_st1 > li:hover > a{background:#f5f5f5; color:#333;} .tab_st1 > li.on > a{ background:#fff;border-color:#444549; color:#333; z-index:1} .tab_st1 > li.on > a:before, .tab_st1 > li.on > a:after{ content:""; position:absolute; bottom:0; width:0; height:0; border-top: 30px solid rgba(0,0,0,.1)} .tab_st1 > li.on > a:before{ left:-16px; border-left: 15px solid transparent} .tab_st1 > li.on > a:after{ right:-16px; border-right: 15px solid transparent} .tab_st1.st1:after{ content:""; position:absolute; left:0; bottom:0; width:100%; height:1px; background:#333} .tab_st3{ font-size:0; padding-right:1px; border-bottom:1px solid #666} .tab_st3 > li{ display:inline-block; *display:inline; zoom:1; vertical-align:top; font-size:16px; font-size:1rem; width:33.33%;} .tab_st3 > li > a{ display:block; border:1px solid #ddd; border-bottom:none; height:40px; text-align:center; margin:0 -1px 0 0; font-size:.875em; font-weight:bold; color:#777; margin-top:5px; position:relative; border-radius:5px 5px 0 0; padding:0 10px} .tab_st3 > li > a .small{ display:inline-block; vertical-align: baseline; font-size:.875em; opacity:.7} .tab_st3 > li:hover > a{ background:#f7f7f7; color:#333} .tab_st3 > li.on > a{ color:#fff; border-color:#666; color:#333; margin-top:0; height:45px; z-index:1; box-shadow:1px 0 3px rgba(0,0,0,.3); /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ffffff+50,eeeeee+100 */ background: rgb(255,255,255); /* Old browsers */ background: -moz-linear-gradient(top, rgba(255,255,255,1) 60%, rgba(238,238,238,1) 100%); /* FF3.6-15 */ background: -webkit-linear-gradient(top, rgba(255,255,255,1) 60%,rgba(238,238,238,1) 100%); /* Chrome10-25,Safari5.1-6 */ background: linear-gradient(to bottom, rgba(255,255,255,1) 60%,rgba(238,238,238,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#eeeeee',GradientType=0 ); /* IE6-9 */ } .tab_st3 > li.on > a:before{content:"\e935"; font-family:xeicon!important; position:absolute; width:100%; text-align:center; color:#666; bottom:-13px} .tab_st4{ font-size:0; margin:0 -1px 25px 0} .tab_st4 > li{ display:inline-block; *display:inline; zoom:1; vertical-align:top; font-size:16px; font-size:1rem; width:20%;} .tab_st4 > li > a{ display:block; height:40px; text-align:center; margin:0 1px 0 0; font-size:.875em; font-weight:bold; color:#fff; position:relative; border-radius:5px; padding:0 10px; background:#777; opacity:.7} .tab_st4 > li:hover > a{ opacity:1;} .tab_st4 > li.on > a{ opacity:1; background:#11b0e9;} .pop_tit_select_wrap{ height:50px; position:relative} .pop_tit_select{ position:absolute; left:-10px; top:55px; background:#fff; border:1px solid transparent; border-radius:5px} .pop_tit_select > li{ display:none} .pop_tit_select > li *{ transition:.3s} .pop_tit_select > li > a { display:block; position:relative; overflow:hidden; font-size:.813em; padding:0 50px 0 10px; color:#666; white-space:nowrap; border-top:1px solid #ddd; border-bottom:none; min-width:300px} .pop_tit_select > li > a:before{ content:"\e93f"; font-family:xeicon!important; position:absolute; right:-10px; top:0; color:#aaa; transition:.3s} .pop_tit_select > li:first-child > a{ border-radius:5px 5px 0 0} .pop_tit_select > li:last-child > a{ border-radius:0 0 5px 5px} .pop_tit_select > li:hover > a{ background:#f5f5f5; color:#333} .pop_tit_select > li:hover > a:before{ right:15px} .pop_tit_select > li.on{ position:absolute; left:0; top:-55px; display:block; cursor:pointer} .pop_tit_select > li.on > a{ background:none; font-size:1.063em; border-top:none; color:#fff;border:1px solid rgba(255,255,255,.3); line-height:38px; margin:4px 0 0 0; border-radius:5px} .pop_tit_select > li.on > a:before{ content:"\e943"; right:15px; color:#fff; transition:.3s} .pop_tit_select > li.on:hover > a{ border-color:#fff} .pop_tit_select > li.on:hover > a:before{ transform:rotate(360deg)} .pop_tit_select.show{ border-color:#005aa6; box-shadow:1px 1px 5px rgba(0,0,0,.3)} .pop_tit_select.show > li.on > a{ border-color:#fff} .pop_tit_select.show > li.on > a:before{ content:"\e946"} .pop_tit_select.show > li.on:hover > a:before{transform:rotate(0deg)} .pop_tit_select > li.on:after{ content:""; width:100%; height:100%; position:absolute; left:0; top:0; z-index:1} /**/ .board_photo_wrap{ margin:0 0 -30px -20px} .board_photo_wrap .list{ float:left; width:33.33%; cursor:pointer;} .board_photo{ margin:0 0 30px 20px; border:1px solid #ddd; padding:2px 2px 14px 2px;} .board_photo .img{ margin:5px; overflow:hidden; background:#f5f5f5; position:relative} .board_photo .img:before{ content:""; position:absolute; left:0; top:0; width:100%; height:100%; background:url(../images/inc/logo_gray2.png) no-repeat center center; background-size: 40% auto} .board_photo .img > img{ position:relative; width:100%; height:100%;} .board_photo .img2{ position:relative; margin:5px; overflow:hidden;} .board_photo .img2 span.tim{ position:absolute; right:5px; bottom:5px; width:28%; text-align:center; background:rgba(0,154,234,0.6); font-size:0.813em; color:#fff; padding:1px 0;} .board_photo .photo_tit{ text-align:center; text-overflow:ellipsis; white-space:nowrap; overflow:hidden; padding:7px 0} .board_photo .photo_tit2{ text-align:left; text-overflow:ellipsis; white-space:nowrap; overflow:hidden; padding:7px 10px; height:20px; overflow:hidden; line-height:1.3; font-size:0.875em; font-weight:600; color:#333;} .board_photo .title{ font-size:0.813em; color:#666; padding:0 10px; height:32px; overflow:hidden;} .board_photo .photo_ex{ overflow:hidden; padding:10px 10px 0 10px; margin:10px 0 0 0; border-top:1px dashed #d6d6d6;} .board_photo .photo_ex > li{ overflow:hidden; font-size:0.75em;} .board_photo .photo_ex .hit{ float:left; font-weight:600; color:#444; text-align:left; color:#0789d5;} .board_photo .photo_ex .date{ float:right; color:#999; text-align:right; } .board_photo .date2{ font-size:0.750em; color:#999; padding:5px 10px 10px; overflow:hidden;} .board_photo .date2 span.dat{ float:right; width:55%; text-align:right; padding:1px 0;} .board_photo .op{ text-align:center; padding-top:5px} .board_photo:hover .img, .board_photo:hover .img2, .board_photo:hover .photo_tit{} /**/ .banner_w{} .banner_w ul{ overflow:hidden; margin:0 0 -20px -10px;} .banner_w ul li{ float:left; width:25%;} .banner_w ul li:hover .m_box1 .m_ban_plus{ border:1px solid #888; background:url(../images/inc/icon_plus_on.png) no-repeat center center;} .banner_w ul li .m_box1{ display:block; padding:10px; margin:0 0 20px 10px; cursor:pointer; background:#fff; border:1px solid #ddd; border-bottom-width:5px; *zoom:1;} .banner_w ul li .m_box1:after{ content:""; display:block; clear:both;} .banner_w ul li .m_box1 .img{ width:100%; height:80px;} .banner_w ul li .m_box1 .tt_wrap{ padding:10px 10px 0 10px; border-top:1px dashed #d6d6d6; margin:10px 0;} .banner_w ul li .m_box1 .m_ban_tit{ font-size:0.813em; font-weight:600; color:#000; line-height:20px; padding:0 0 5px 0;} .banner_w ul li .m_box1 .m_ban_txt{ font-size:0.750em; color:#666; line-height:20px;} .banner_w ul li .m_box1 .m_ban_plus{ float:right; width:10%; height:18px; font-size:0; text-indent:-9999px; border:1px solid #ccc; border-radius:2px; background:url(../images/inc/icon_plus.png) no-repeat center center;} .banner_w ul li .m_box1 .img_w{ text-align:center; padding:10px 10px; background:#fff; border-bottom:1px solid rgba(7, 136, 212, 0.7); transition:all 0.3s;} .banner_w ul li .m_box1 .img_w img{} .banner_w ul li .m_box1 .addr{ font-size:0.813em; color:#666; text-align:center; transition:all 0.3s; padding:15px 10px 10px 10px; height:15px; overflow:hidden; word-break:break-all;} .banner_w ul li .m_box1:hover .addr a{ color:#0789d5;} .banner_w ul li .m_box1 .txt{ font-size:1.063em; color: #000; word-break:keep-all; padding:0px 20px; overflow:hidden; height:26px; text-align:center; letter-spacing:-1px; line-height:26px; transition:all 0.3s;} /*MAIN STYLE*******************/ #main_visual{ position:relative; z-index:1; overflow:hidden; height:430px} #main_visual .img{ height:430px; background-position:50% 50%; background-size:cover;} #main_visual .flex-direction-nav, #main_visual .flex-pauseplay{ position:absolute; z-index:10; left:50%; top:260px; font-size:0} #main_visual .flex-direction-nav{ width:1200px; margin-left:-700px; text-align:right} #main_visual .flex-pauseplay{ margin-left:500px;} #main_visual .flex-direction-nav li{ display:inline-block; *display:inline; zoom:1; vertical-align:bottom} #main_visual .flex-direction-nav a, #main_visual .flex-pauseplay a{ display:block; width:50px; height:50px; text-align:center;} #main_visual .flex-direction-nav a:before, #main_visual .flex-pauseplay a:before{ font-family:xeicon !important; font-style:normal; font-weight:normal; font-size:30px; color:#333;} #main_visual .flex-direction-nav li a.flex-prev:before{ content:"\e93c"} #main_visual .flex-direction-nav li a.flex-next:before{ content:"\e93f"} #main_visual .flex-pauseplay a.flex-pause:before{ content:"\ea3d"} #main_visual .flex-pauseplay a.flex-play:before{ content:"\ea40"} #main_visual .slogan{ position:absolute; z-index:10; left:0; top:40px; width:100%; text-align:right; opacity:0; margin-left:200px; transition:1s} #main_visual .slogan.Ani{ opacity:1; margin-left:-60px} #main_visual .main_system{ position:absolute; z-index:2; left:0; bottom:10px; margin-left:0; width:100%;} #main_visual .main_system .list{ font-size:0; text-align:center; } #main_visual .main_system .list > li{ display:inline-block; *display:inline; zoom:1; vertical-align:top; font-size:16px; font-size:1rem} #main_visual .main_system .list > li > a{ display:block; width:245px; height:84px; border:1px solid #61738e; background:#fff; position:relative; margin:0 2px} #main_visual .main_system .list > li > a:before, #main_visual .main_system .list > li > a:after{ content:""; position:absolute; top:0; width:0; height:2px; transition:.3s} #main_visual .main_system .list > li > a:before{ right:50%} #main_visual .main_system .list > li > a:after{ left:50%} #main_visual .main_system .list > li.m1 > a:before, #main_visual .main_system .list > li.m1 > a:after{ background:#1651a8} #main_visual .main_system .list > li.m2 > a:before, #main_visual .main_system .list > li.m2 > a:after{ background:#248ad9} #main_visual .main_system .list > li.m3 > a:before, #main_visual .main_system .list > li.m3 > a:after{ background:#16accc} #main_visual .main_system .list > li.m4 > a:before, #main_visual .main_system .list > li.m4 > a:after{ background:#2db7b5} #main_visual .main_system .list > li > a .icon{ position:absolute; left:10px; top:10px; width:40px; height:40px; border-radius:100%} #main_visual .main_system .list > li > a .icon img{ width:24px} #main_visual .main_system .list > li > a .con{ display:block; padding:13px 0 0 55px; text-align:left} #main_visual .main_system .list > li > a .con .t1{ display:block; color:#333; font-size:1.063em; letter-spacing:-2px; font-family:notokrM, sans-serif} #main_visual .main_system .list > li > a .con .t2{ display:block; color:#777; font-size:.813em; line-height:1.2; margin:7px 0 0 1px; font-family:notokrR, sans-serif} #main_visual .main_system .list > li.gray > a{ background:#efefef} #main_visual .main_system .list > li.m1 > a .icon{ background-color:#1651a8} #main_visual .main_system .list > li.m2 > a .icon{ background-color:#248ad9} #main_visual .main_system .list > li.m3 > a .icon{ background-color:#16accc} #main_visual .main_system .list > li.m4 > a .icon{ background-color:#2db7b5} #main_visual .main_system .list > li > a:hover{ box-shadow:1px 1px 4px rgba(0,0,0,.5)} #main_visual .main_system .list > li > a:hover:before, #main_visual .main_system .list > li > a:hover:after{ width:50%} .main_conwrap1{ padding:20px 0 0 0} .main_conwrap1 .con_wrap .con1{ float:left; width:510px} .main_conwrap1 .con_wrap .con2{ float:left; width:335px; margin-left:10px} .main_conwrap1 .con_wrap .con3{ float:left; width:335px; margin-left:10px} .main_conwrap1 .con_wrap .main_board_wrap2{ border:1px solid #ccc; padding:0 35px; height:208px} .main_conwrap1 .con_wrap .main_board_wrap2 .list > li > a{ display:block; position:relative; line-height:27px; padding:0 70px 0 25px} .main_conwrap1 .con_wrap .main_board_wrap2 .list > li > a .icon{ position:absolute; left:0; top:2px} .main_conwrap1 .con_wrap .main_board_wrap2 .list > li > a .icon:before{content:"\e9d8"; color:#aaa; font-size:.938em} .main_conwrap1 .con_wrap .main_board_wrap2 .list > li > a .icon.new:before{content:"\e9a8"; color:#0158a5; font-size:1.063em} .main_conwrap1 .con_wrap .main_board_wrap2 .list > li > a .tt{ display:block; font-size:.875em; font-weight:bold; color:#666; text-overflow:ellipsis; white-space:nowrap; overflow:hidden} .main_conwrap1 .con_wrap .main_board_wrap2 .list > li > a .date{ position:absolute; right:0; top:0; font-size:.75em; color:#777; text-align:right; width:70px} .main_conwrap1 .con_wrap .main_board_wrap2 .list > li > a:hover{ text-decoration:underline} .main_conwrap1 .con_wrap .main_board_wrap2 .list > li > a:hover .tt{ color:#111} .main_conwrap1 .con_wrap .photo_slider_wrap{ position:relative} .main_conwrap1 .con_wrap .photo_slider .img_wrap{padding-bottom:30px; } .main_conwrap1 .con_wrap .photo_slider .img_wrap > a{ display:block; position:relative; background: url(../images/inc/logo_gray.png) no-repeat center center #666; background-size:30% auto; height:180px} .main_conwrap1 .con_wrap .photo_slider .img_wrap > a img{ width:100%; height:100%} .main_conwrap1 .con_wrap .photo_slider .img_wrap > a .bar{ position:absolute; bottom:-30px; left:0; height:30px; line-height:30px; width:100%; background:#333; background:rgba(0,0,0,.7)} .main_conwrap1 .con_wrap .photo_slider .img_wrap > a .bar .photo_tit{ display:block; color:#fff; font-weight:bold; font-size:.813em; line-height:28px; padding:0 110px 0 15px; text-overflow:ellipsis; white-space:nowrap; overflow:hidden; opacity:0; transition:2s} .main_conwrap1 .con_wrap .photo_slider .img_wrap.flex-active-slide > a .bar .photo_tit{ opacity:1} .main_conwrap1 .con_wrap .photo_slider .img_wrap > a:hover .bar .photo_tit{ text-decoration:underline} .main_conwrap1 .con_wrap .photo_slider .flex-control-nav{ position:absolute; right:10px; bottom:9px; z-index:10 } .main_conwrap1 .con_wrap .photo_slider .flex-control-nav > li{ display:inline-block; *display:inline; zoom:1} .main_conwrap1 .con_wrap .photo_slider .flex-control-nav > li > a{ display:block; width:12px; height:12px; background:#fff; border-radius:12px; margin:0 0 0 2px; font-size:0; transition:.3s} .main_conwrap1 .con_wrap .photo_slider .flex-control-nav > li > a.flex-active{ background:#0ac9e3; width:30px} .main_conwrap1 .con_wrap .main_con_tit{ position:relative; font-family:notokrM, sans-serif; padding:15px 0 8px 0; margin-bottom:12px; border-bottom:1px solid #ddd} .main_conwrap1 .con_wrap .main_con_tit .more{ position:absolute; right:0; top:15px; font-size:.75em; color:#666; line-height:20px; padding:0 10px; border-radius:20px; margin-right:-10px} .main_conwrap1 .con_wrap .main_con_tit .more:hover{ background:#005aa6; color:#fff} .main_conwrap1 .con_wrap .main_con_tit .tit{ font-size:1.125em} .main_conwrap1 .con_wrap .photo_slider_wrap .main_con_tit{ position:absolute; left:0; top:0; z-index:10; width:100%; border-bottom:none; /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#000000+0,ffffff+100&0.5+0,0+100 */ background: -moz-linear-gradient(top, rgba(0,0,0,0.4) 50%, rgba(255,255,255,0) 100%); /* FF3.6-15 */ background: -webkit-linear-gradient(top, rgba(0,0,0,0.4) 50%,rgba(255,255,255,0) 100%); /* Chrome10-25,Safari5.1-6 */ background: linear-gradient(to bottom, rgba(0,0,0,0.4) 50%,rgba(255,255,255,0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#80000000', endColorstr='#00ffffff',GradientType=0 ); /* IE6-9 */ } .main_conwrap1 .con_wrap .photo_slider_wrap .main_con_tit .tit{ margin-left:20px; color:#fff; font-size:1.188em} .main_conwrap1 .con_wrap .photo_slider_wrap .main_con_tit .more{ right:20px; color:#fff} .main_conwrap2{ background:#f2f2f2; padding:25px 0 15px 0} .main_conwrap2 .main_tit{ text-align:center; margin-bottom:15px} .main_conwrap2 .main_tit .t1{ vertical-align:middle; font-size:1.5em; color:#111; font-weight:600; font-family:notokrM, sans-serif; letter-spacing:-1px; word-spacing:3px} .main_conwrap2 .main_tit .more{ display:inline-block; *display:inline; zoom:1; vertical-align:middle; padding:0 15px 0 20px; background:#00a3dd; font-size:.75em; color:#fff; border-radius:30px; margin-left:10px; font-weight:bold; line-height:25px} .main_conwrap2 .main_tit .more .icon:before{ content:"\e914"; transition:.3s} .main_conwrap2 .main_tit .more:hover .icon{ transform:rotate(180deg)} .main_conwrap2 .con_wrap{} .main_conwrap2 .con_wrap .con1{ float:left; width:510px} .main_conwrap2 .con_wrap .con2{ float:left; width:345px} .main_conwrap2 .con_wrap .con3{ float:left; width:345px} .main_conwrap2 .con_wrap .link_wrap{ font-size:0; padding-left:1px; margin-bottom:-1px} .main_conwrap2 .con_wrap .link_wrap > *{ display:inline-block; *display:inline; zoom:1; vertical-align:top; font-size:16px; font-size:1rem; width:20%; text-align:center} .main_conwrap2 .con_wrap .link_wrap .va_wrap{ height:108px} .main_conwrap2 .con_wrap .link_wrap .in{ display:block; border:1px solid #c3c4c6; padding:0 5px; margin:0 -1px 0 0; position:relative} .main_conwrap2 .con_wrap .link_wrap .link_tit{} .main_conwrap2 .con_wrap .link_wrap .link_tit .tit{ color:#fff; font-weight:bold; font-size:.875em} .main_conwrap2 .con_wrap .link_wrap .link_tit .arrow{ position:absolute; right:-14px; top:50%; margin-top:-12px; z-index:2} .main_conwrap2 .con_wrap .link_wrap .link_tit .arrow:before{ content:"\ea3e"} .main_conwrap2 .con_wrap .link_wrap.st1 .link_tit .arrow{ color:#24446d} .main_conwrap2 .con_wrap .link_wrap.st2 .link_tit .arrow{ color:#0f74bb} .main_conwrap2 .con_wrap .link_wrap.st3 .link_tit .arrow{ color:#15abe2} .main_conwrap2 .con_wrap .link_wrap.st1 .link_tit{ background:#24446d} .main_conwrap2 .con_wrap .link_wrap.st2 .link_tit{ background:#0f74bb} .main_conwrap2 .con_wrap .link_wrap.st3 .link_tit{ background:#15abe2} .main_conwrap2 .con_wrap .link_wrap .link_con .in{ overflow:hidden} .main_conwrap2 .con_wrap .link_wrap .link_con .in .va_tt{ vertical-align:top} .main_conwrap2 .con_wrap .link_wrap .link_con .in .icon{ display:block; line-height:40px; font-size:1.75em; margin-top:20px} .main_conwrap2 .con_wrap .link_wrap .link_con .in .tit{ display:block; font-weight:bold; color:#333; font-size:.813em; line-height:15px; height:30px; margin-top:10px; position:relative} .main_conwrap2 .con_wrap .link_wrap .link_con .in:after{ content:""; position:absolute; width:14px; height:14px; right:-7px; bottom:-7px; transform:rotate(45deg); opacity:0; transition:.3s} .main_conwrap2 .con_wrap .link_wrap.st1 .link_con .in:after{ background:#24446d} .main_conwrap2 .con_wrap .link_wrap.st2 .link_con .in:after{ background:#0f74bb} .main_conwrap2 .con_wrap .link_wrap.st3 .link_con .in:after{ background:#15abe2} .main_conwrap2 .con_wrap .link_wrap.st1 .link_con .in .icon{ color:#24446d} .main_conwrap2 .con_wrap .link_wrap.st2 .link_con .in .icon{ color:#0f74bb} .main_conwrap2 .con_wrap .link_wrap.st3 .link_con .in .icon{ color:#15abe2} .main_conwrap2 .con_wrap .link_wrap .link_con .in:hover{ z-index:1; /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#eeeeee+0,ffffff+100 */ background: rgb(238,238,238); /* Old browsers */ background: -moz-linear-gradient(top, rgba(238,238,238,1) 0%, rgba(255,255,255,1) 100%); /* FF3.6-15 */ background: -webkit-linear-gradient(top, rgba(238,238,238,1) 0%,rgba(255,255,255,1) 100%); /* Chrome10-25,Safari5.1-6 */ background: linear-gradient(to bottom, rgba(238,238,238,1) 0%,rgba(255,255,255,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#eeeeee', endColorstr='#ffffff',GradientType=0 ); /* IE6-9 */ } .main_conwrap2 .con_wrap .link_wrap.st1 .link_con .in:hover{ border-color:#24446d} .main_conwrap2 .con_wrap .link_wrap.st2 .link_con .in:hover{ border-color:#0f74bb} .main_conwrap2 .con_wrap .link_wrap.st3 .link_con .in:hover{ border-color:#15abe2} .main_conwrap2 .con_wrap .link_wrap .link_con .in:hover:after{ opacity:1} .main_conwrap2 .con_wrap .board_st2{ } .main_conwrap2 .con_wrap .board_st2 .main_board_wrap{ border:1px solid #c3c4c6; border-left:none; background:#fff; margin-bottom:-1px} .main_conwrap2 .con_wrap .board_st2 .main_board_wrap.h1{ height:326px} .main_conwrap2 .con_wrap .board_st2 .main_board_wrap.h2{ height:162px} .main_conwrap2 .con_wrap .board_st2 .main_board_wrap.h3{ height:163px} .main_conwrap2 .con_wrap .board_st2 .in{ padding:15px 25px} .main_conwrap2 .con_wrap .board_st2 .in .board_tit{ position:relative; font-size:.938em; color:#111; font-weight:bold; line-height:25px; margin-bottom:7px} .main_conwrap2 .con_wrap .board_st2 .in .board_tit .more{ position:absolute; right:0; top:0; width:25px; border:1px solid #ddd; text-align:center; color:#aaa; transition:.3s} .main_conwrap2 .con_wrap .board_st2 .in .board_tit .more .xi:before{ content:"\e9c5"; font-family:xeicon!important; font-size:.75em} .main_conwrap2 .con_wrap .board_st2 .in .board_tit .more:hover{ transform:rotate(90deg); border-color:#999; color:#111} .main_conwrap2 .con_wrap .board_st2 .in .list_big .tit{ display:block; line-height:30px; position:relative; padding-right:60px} .main_conwrap2 .con_wrap .board_st2 .in .list_big .tit .t1{ display:block; font-size:.875em; font-weight:bold; color:#333; text-overflow:ellipsis; white-space:nowrap; overflow:hidden} .main_conwrap2 .con_wrap .board_st2 .in .list_big .tit .t2{ width:60px; position:absolute; right:0; top:0; text-align:right; font-size:.688em; color:#999} .main_conwrap2 .con_wrap .board_st2 .in .list_big .tit:hover .t1{ text-decoration:underline} .main_conwrap2 .con_wrap .board_st2 .in .list_big .tt{ line-height:16px; height:32px; font-size:.75em; color:#666; overflow:hidden; margin:0 0 8px 0} .main_conwrap2 .con_wrap .board_st2 .in .list_big .date{ line-height:30px; color:#999; font-size:.813em} .main_conwrap2 .con_wrap .board_st2 .in .list_big .img{ line-height:20px; height:120px; overflow:hidden; padding:10px 0} .main_conwrap2 .con_wrap .board_st2 .in .list_big .file > li > a{ line-height:25px; display:block; font-size:.813em; text-overflow:ellipsis; white-space:nowrap; overflow:hidden} .main_conwrap2 .con_wrap .board_st2 .in .list_big .file > li > a .xi{ color:#aaa; margin-right:3px; margin-top:1px} .main_conwrap2 .con_wrap .board_st2 .in .list_big .file > li > a .t1{ color:#777} .main_conwrap2 .con_wrap .board_st2 .in .list_big .file > li > a .t2{ color:#333} .main_conwrap2 .con_wrap .board_st2 .in .list > li > a{ display:block; line-height:25px; padding-right:70px; position:relative} .main_conwrap2 .con_wrap .board_st2 .in .list > li > a .tt{ display:block; font-size:.813em; color:#333; text-overflow:ellipsis; white-space:nowrap; overflow:hidden} .main_conwrap2 .con_wrap .board_st2 .in .list > li > a .tt:before{ content:"- "} .main_conwrap2 .con_wrap .board_st2 .in .list > li > a .date{ position:absolute; right:0; top:0; text-align:right; font-size:.688em; color:#999; width:70px} .main_conwrap2 .con_wrap .board_st2 .in .list > li > a:hover .tt{ font-weight:bold; color:#111} /*파트너스*/ .b_slide .partner_area{ position:relative; margin-top:15px; text-align:center;} .b_slide .partner_area .part_tit{ display:inline-block; *display:inline; zoom:1; padding:0 20px; line-height:40px; font-size:0.938em; font-weight:600; border:1px solid #ddd; border-bottom:0; border-radius:3px 3px 0 0; background:#fff; margin:0 0 -1px 0; border-top:2px solid #1591c8;} .b_slide .partner_area .partner{ border:1px solid #ddd; padding:5px 13px; border-radius:5px; background:#fff;} .b_slide .partner_area .partner ul li{ margin-right:5px;} .b_slide .partner_area .partner .btn{ position:absolute; right:12px; top:24px;} .b_slide .partner_area .partner .btn .btn_m{ width:36px; height:22px; font-size:0.750em; background:#999; color:#fff; border:1px solid #999; transition:all 0.3s;} .b_slide .partner_area .partner .btn .btn_m:hover{ background:#fff; color:#666;} .b_slide2{ border-top:1px solid #ddd; background:#fff;} .main_body .b_slide2.banner1{ border-top:none} .b_slide2 .partner_area2{ padding:10px 0;} .b_slide2 .partner_area2 .partner{ position:relative;} .b_slide2 .partner_area2 .partner ul li{ text-align:center;} .b_slide2 .partner_area2 .partner ul li > a > img{ display:inline;} .b_slide2 .partner_area2 .partner .left_w{ float:left; position:relative; text-align:center;} .b_slide2 .partner_area2 .partner .left_w .tit{ width:100px; height:50px; line-height:50px; border:1px solid transparent; background:#999; font-family:notokrM,sans-serif; color:#fff; letter-spacing:-1px;} .b_slide2 .partner_area2 .partner .left_w .tit a{ display:block; color:#fff} .b_slide2 .partner_area2 .partner .left_w .tit a .plus{ margin-left:10px} .b_slide2 .partner_area2 .partner .left_w .tit a:hover{ background:#888} .b_slide2 .partner_area2 .partner .slider a{ display:block; height:50px; border:1px solid #ccc;} .b_slide2 .partner_area2 .partner .slider a:hover{ border-color:#666} .partner_area2 .partner .bx-wrapper{ max-width:970px !important; float:right; position:static;} .partner_area2 .partner .bx-wrapper .bx-viewport{} .partner_area2 .partner .bx-wrapper .bx-controls-direction a{ position: absolute; top:0; width:52px; height:50px; line-height:50px; text-align:center; border:1px solid #ccc; background:#f5f5f5; text-indent:inherit; font-size:0;} .partner_area2 .partner .bx-wrapper .bx-controls-direction a:before{ font-family:xeicon !important; font-style:normal; color:#555; font-size:22px;} .partner_area2 .partner .bx-wrapper .bx-prev { left:102px;} .partner_area2 .partner .bx-wrapper .bx-next { left:155px;} .partner_area2 .partner .bx-wrapper .bx-prev:before { content:"\e93b";} .partner_area2 .partner .bx-wrapper .bx-next:before { content:"\e93e";} .partner_area2 .partner .bx-wrapper .bx-controls-direction a:hover { z-index:100001; border-color:#005aa6; transition:.3s;} .partner_area2 .partner .bx-wrapper .bx-controls-direction a:hover:before{ color:#005aa6;} /**/ .sub_info_con{ padding:30px 0 50px 0} .sub_info_con .page_tit_de:first-child{ margin-top:0} .sub_info_con .search_wrap{ margin-top:0} .sub_info_con .sub_top_wrap{ margin-bottom:20px; border-bottom:1px solid #e1e5e7; padding:15px 0; background:#f9fbfc; line-height:40px;} .sub_info_con .sub_top_wrap .tit{ display:block;font-size:1.75em; letter-spacing:-2px; text-align:center; font-family:notokrM, sans-serif; color:#111; float:left} .sub_info_con .sub_top_wrap .tit strong{ font-weight:normal} .sub_info_con .sub_top_wrap .sub_tab_wrap{ float:right} .sub_tab_wrap .gnb > li, .sub_tab_wrap .gnb > li .dp1, .sub_tab_wrap .gnb > li .dp2 > li, .sub_tab_wrap .gnb > li .dp2 > li > a, .sub_tab_wrap .gnb > li .dp4{ display:none} .sub_tab_wrap .gnb > li.on, .sub_tab_wrap .gnb > li .dp2 > li.on{ display:block} .sub_tab_wrap .gnb > li .dp2 > li .dp3{ font-size:0; } .sub_tab_wrap .gnb > li .dp2 > li .dp3 > li{ display:inline-block; *display:inline; zoom:1; vertical-align:top; font-size:16px; font-size:1rem; width:175px} .sub_tab_wrap .gnb > li .dp2 > li .dp3 > li > a{ display:block; text-align:center; border:1px solid #ddd; font-size:.875em; color:#333; margin-right:-1px; background:#fff; font-weight:bold; position:relative} .sub_tab_wrap .gnb > li .dp2 > li .dp3 > li > a:before{ content:""; position:absolute; left:-1px; top:-1px; width:100%; height:3px; background:#ddd; padding:0 1px; transition:.3s} .sub_tab_wrap .gnb > li .dp2 > li .dp3 > li:hover > a:before{ background:#999} .sub_tab_wrap .gnb > li .dp2 > li .dp3 > li.on > a{ color:#005aa6} .sub_tab_wrap .gnb > li .dp2 > li .dp3 > li.on > a:before{ background:#005aa6} .sub_tab_wrap .gnb > li .dp2 > li .dp3 > li > a:after{ content:"\e935"; font-family:xeicon!important; position:absolute; left:0; top:37px; width:100%; text-align:center; line-height:1; color:#005aa6; opacity:0} .sub_tab_wrap .gnb > li .dp2 > li .dp3 > li.on > a:after{ opacity:1} .sub_info_db_search{ padding:2px; border-radius:3px; box-shadow:0 1px 3px rgba(0,0,0,.2); background:#005aa6} .sub_info_db_search .in{ padding:20px 30px 10px 30px; /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ffffff+50,eeeeee+100 */ background: rgb(255,255,255); /* Old browsers */ background: -moz-linear-gradient(top, rgba(255,255,255,1) 70%, rgba(238,238,238,1) 100%); /* FF3.6-15 */ background: -webkit-linear-gradient(top, rgba(255,255,255,1) 70%,rgba(238,238,238,1) 100%); /* Chrome10-25,Safari5.1-6 */ background: linear-gradient(to bottom, rgba(255,255,255,1) 70%,rgba(238,238,238,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#eeeeee',GradientType=0 ); /* IE6-9 */} .sub_info_db_search .in .tit_wrap{ float:left; line-height:40px; background:#005aa6; color:#fff; border-radius:50px 0 0 50px; padding:0 40px 0 30px; font-family:notokrM, sans-serif; letter-spacing:-1px; position:relative} .sub_info_db_search .in .tit_wrap:before{ content:"\ea3e"; font-family:xeicon!important; position:absolute; right:10px; top:0; font-size:.813em} .sub_info_db_search .in .con_wrap{ float:left} .sub_info_db_search .in .con_wrap .search{ position:relative} .sub_info_db_search .in .con_wrap .search .inp_in{ height:38px; border:1px solid #005aa6; border-radius:0 50px 50px 0; padding-right:50px} .sub_info_db_search .in .con_wrap .search .inp_in .inp{ border:none; font-size:.813em; padding:10px 10px 9px 15px} .sub_info_db_search .in .con_wrap .search .inp_in select.inp{ font-weight:bold; padding-right:40px} .sub_info_db_search .in .con_wrap .search .inp_in .inp.w1{ width:250px} .sub_info_db_search .in .con_wrap .search .btn_in{ position:absolute; right:0; top:0} .sub_info_db_search .in .con_wrap .search .btn_in .btn{ height:40px; width:40px; background:#555; border:none; border-radius:100%; color:#fff; transition:.3s} .sub_info_db_search .in .con_wrap .search .btn_in .btn .xi{ transition:.3s} .sub_info_db_search .in .con_wrap .search .btn_in .btn:hover{ background:#333} .sub_info_db_search .in .con_wrap .search .btn_in .btn:hover .xi{ transform:rotateY(360deg)} .sub_info_db_search .tt{ padding:0 10px 0 10px} .sub_info_db_search .tt .t1{ font-size:.75em; margin-top:5px; position:relative; padding-left:10px; color:#666} .sub_info_db_search .tt .t1:before{ content:""; position:absolute; width:3px; height:3px; background:#666; border-radius:100%; left:0; top:7px} .sub_info_db_search_re{ overflow:hidden} .sub_info_db_search_re .tit{ float:left} .sub_info_db_search_re .search{ float:right} .sub_info_db_search_re .search .t1{ font-size:.875em; color:#005aa6; font-weight:bold; float:left; line-height:35px; padding:0 10px; position:relative} .sub_info_db_search_re .search .t1:before{ content:""; position:absolute; left:0; top:17px; width:5px; height:5px; background:#005aa6; border-radius:100%} .sub_info_db_search_re .search .inp_wrap{ float:left; position:relative} .sub_info_db_search_re .search .inp_wrap .inp{ border:1px solid #ddd; width:200px; padding:5px 40px 5px 20px; line-height:15px; height:25px; border-radius:50px; font-size:.813em} .sub_info_db_search_re .search .inp_wrap .btn{ position:absolute; z-index:1; right:0; top:0; line-height:35px; width:35px; text-align:center; border:1px solid #ddd; border-radius:50px; color:#666; transition:.3s; /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ffffff+50,eeeeee+100 */ background: rgb(255,255,255); /* Old browsers */ background: -moz-linear-gradient(top, rgba(255,255,255,1) 40%, rgba(238,238,238,1) 100%); /* FF3.6-15 */ background: -webkit-linear-gradient(top, rgba(255,255,255,1) 40%,rgba(238,238,238,1) 100%); /* Chrome10-25,Safari5.1-6 */ background: linear-gradient(to bottom, rgba(255,255,255,1) 40%,rgba(238,238,238,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#eeeeee',GradientType=0 ); /* IE6-9 */} .sub_info_db_search_re .search .inp_wrap .btn:hover{ color:#fff; background:#666; border-color:transparent} .sub_info_db_tab .tab{ font-size:0; margin-top:20px; padding-right:1px} .sub_info_db_tab .tab > li{ display:inline-block; *display:inline; zoom:1; vertical-align:top; width:20%; font-size:16px; font-size:1rem} .sub_info_db_tab .tab > li > a{ display:block; padding:15px 10px; font-weight:600; color:#666; border:1px solid #ddd; border-bottom-color:#005aa6; background:#f9f9f9; text-align:center; font-size:.875em; margin-right:-1px; position:relative} .sub_info_db_tab .tab > li:hover > a{ background:#fff; color:#333} .sub_info_db_tab .tab > li.on > a{ background:#fff; border-color:#005aa6; color:#005aa6; border-bottom-color:#fff; z-index:1} .sub_info_db_detail_top{ border:1px solid #aaa; border-radius:5px; position:relative; padding:30px 20px 20px 20px; margin:30px 0} .sub_info_db_detail_top .detail_tit{ position:absolute; line-height:40px; left:10px; top:-20px; padding:0 15px; background:#fff; font-family:notokrM, sans-serif; letter-spacing:-1px; font-size:1.5em; color:#111} .sub_info_db_detail_top .detail_info{ padding-right:100px} .sub_info_db_detail_top .detail_info > li{ padding-left:12px; position:relative; font-size:.875em; color:#666; line-height:18px; margin-top:5px} .sub_info_db_detail_top .detail_info > li:first-child{ margin-top:0} .sub_info_db_detail_top .detail_info > li:before{ content:""; position:absolute; left:2px; top:8px; width:4px; height:4px; background:#005aa6} .sub_info_db_detail_top .detail_info > li strong{ font-weight:600; color:#111} .sub_info_db_detail_top .detail_info > li .c1{ color:#005aa6} .sub_info_db_detail_top .detail_info > li.di{ margin-right:50px} .sub_info_db_detail_top .detail_btn{ position:absolute; right:20px; bottom:20px} .sub_info_db_detail{ padding:0 20px} .sub_info_db_detail2 .sub_info_db_detail_list{ border-top:1px solid #ddd} .sub_info_db_detail2 .sub_info_db_detail_list .clickBtn{ padding:5px 50px 5px 20px; border:1px solid #ddd; border-top:none; border-left:none; border-right:none; background:#f9f9f9; cursor:pointer; position:relative; transition:.3s} .sub_info_db_detail2 .sub_info_db_detail_list .clickBtn:hover{ background:#f1f1f1} .sub_info_db_detail2 .sub_info_db_detail_list .clickBtn:before{ content:"\e941"; font-family:xeicon!important; position:absolute; right:20px; top:50%; margin-top:-12px; color:#aaa; font-size:1.313em; transition:.3s} .sub_info_db_detail2 .sub_info_db_detail_list .clickBtn:after{ content:""; position:absolute; left:0; top:-1px; width:100%; height:0; background:#005aa6; transition:.3s} .sub_info_db_detail2 .sub_info_db_detail_list .clickBtn:hover:before{ color:#333} .sub_info_db_detail2 .sub_info_db_detail_list .clickBtn.on{ background:#fff;} .sub_info_db_detail2 .sub_info_db_detail_list .clickBtn.on:before{ transform:rotate(180deg)} .sub_info_db_detail2 .sub_info_db_detail_list .clickBtn.on:after{ height:1px} .sub_info_db_detail2 .sub_info_db_detail_list .clickCon{ display:none; padding:30px 50px 30px 30px; position:relative; border-bottom:1px solid #ddd} .sub_info_db_detail2 .sub_info_db_detail_list .clickCon .gotop{position:absolute; right:10px; bottom:10px; width:40px; height:40px; text-align:center; border-radius:100%; border:1px solid #ddd; color:#777} .sub_info_db_detail2 .sub_info_db_detail_list .clickCon .gotop:before{content:"\e912"; font-family:xeicon!important; display:block; line-height:1; font-size:.875em; padding-top:5px} .sub_info_db_detail2 .sub_info_db_detail_list .clickCon .gotop:after{ content:"TOP"; font-size:.5em; display:block; font-family: Arial, Helvetica, sans-serif; line-height:1} .sub_info_db_detail2 .sub_info_db_detail_list .clickCon .gotop:hover{ background:#f5f5f5; color:#333} .clickBtnAll{ text-align:right; margin-top:-10px} .clickBtnAll .show, .clickBtnAll .hide{ display:none; position:relative; border:1px solid #ddd; padding:8px 50px 8px 20px; border-bottom:none; font-size:.813em} .clickBtnAll .show:before, .clickBtnAll .hide:before{ content:"\e941"; font-family:xeicon!important; position:absolute; right:20px; top:50%; margin-top:-12px; color:#aaa; font-size:1.5em; transition:.3s} .clickBtnAll .hide:before{ transform:rotate(180deg)} .clickBtnAll .show.on, .clickBtnAll .hide.on{ display: inline-block; *display:inline; zoom:1;} .table_st_db_tit{ text-align:left; font-size:.875em; color:#333; padding:6px 0 4px 0; font-weight:bold} .table_st_db_tit > span:before, .table_st_db_tit > span:after{ margin:0 5px; position:relative; top:-1px} .table_st_db_tit > span:before{ content:"⟨"; margin-left:0} .table_st_db_tit > span:after{ content:"⟩"} .table_st_db_cp{ text-align:right; font-size:.813em; color:#666; margin-bottom:5px; padding-right:3px} .table_st_db_tit + .table_st_db_cp{ margin-top:-15px !important} .table_st_db_cp.mg1{ margin-top:-20px !important} .table_st_db_cp.mg2{ margin-top:-10px !important} .table_st_db{ table-layout:fixed; font-size:.813rem; position:relative} .table_st_db:before{ content:""; position:absolute; right:-1px; top:0; width:2px; height:100%; background:#fff} .table_st_db:after{ content:""; position:absolute; left:0; top:0; width:100%; height:1px; background:#333} .table_st_db th, .table_st_db td{ border:1px solid #ddd; border-left:none; border-top:none} .table_st_db th{ background:#f9f9f9; border-left-color:#f1f1f1; color:#222; padding:15px 10px} .table_st_db td{ text-align:center; color:#444; padding:5px 10px; height:30px} .table_st_db .nocon{ padding:15px 0; text-align:center} .table_st_db a:hover{ text-decoration:underline} .table_st_db.bdnone{ border:1px solid #888;} .table_st_db.bdnone:before, .table_st_db.bdnone:after { display:none;} .table_st_db.bdnone th, .table_st_db.bdnone td{ border:none;} .table_st_db .bdnoneB{ border-bottom:none;} .table_st_db.alink a{ text-decoration:underline} .table_st_db.hover tr:hover td, .table_st_db.hover tr:hover th{ background:#fafafa} .table_st_db.hover tr:hover .nocon{ background:none} .table_st_db.hover2 tr:hover td, .table_st_db.hover2 tbody.hover:hover td{ font-weight:bold; color:#111; background:#fafafa} .table_st_db.size1{ font-size:.75rem} .table_st_db.size1 th{ padding:10px 10px} .table_st_db.size1 td{ line-height:20px} .table_st_db.size2{ font-size:.75rem} .table_st_db.size2 th, .table_st_db.size2 td{ padding:5px; height:auto} .table_st_db.size3{} .table_st_db.size3 td{ height:35px} .table_st_db.size4{ font-size:.75rem} .table_st_db.size4 th, .table_st_db.size4 td{ padding:10px 5px; height:auto} .table_st_db .st1 th, .table_st_db th.st1{ background:#fff} .table_st_db .st2 th, .table_st_db th.st2{ background:#e6f3fb; border-bottom-color:#c7d5de; font-size:1.063em} .table_st_db .st3 td, .table_st_db td.st3{ background:#fafdff} .table_st_db .st4 th, .table_st_db th.st4{ background:#fff; padding-left:15px; padding-right:15px; font-size:1.063em; color:#000} .table_st_db .st4 th .small, .table_st_db th.st4 .small{ font-size:.875em; vertical-align:baseline; color:#666} .table_st_db.tst1:after{ background:#0ac9e3; height:1px} .table_st_db.tst1 th{ background:#fff} .table_st_db.tst1 td{ padding-left:1.5em; padding-right:1.5em} .table_st_db .tt1{ display:block; margin:5px 0; line-height:1.4} .table_st_db .in1{ text-indent:-16px; padding-left:16px} .table_st_db .in2{ text-indent:-10px; padding-left:10px} .table_st_db .in3{ text-indent:-7px; padding-left:7px} .table_st_db .xi.check{ font-size:1.75em; color:#11b0e9} .table_st_db .xi.check:before{ content:"\e92b"} .table_st_db .lineAngle{ position:absolute; top:0; left:0; width:1px; background:#ccc; transform-origin:top left;} .table_st_db .lineAngle.deg1{ transform:rotate(-75.6deg)} .table_st_db .lineAngle.deg2{ transform:rotate(-81.1deg)} .table_st_db .lineAngle.h1{ height:990px;} .table_st_db .lineAngle.h2{ height:445px;} .table_st_db .unNum{ display:inline-block; *display:inline; zoom:1; padding:.2em .6em 0 .6em; line-height:1; background:#ffffff; font-size:.938em;} .table_st_db .unNum.st1{ background:#fca465; font-size:1.250em;} .table_st_db .unNum.st2{ position:absolute; top:40%; left:50%; margin-left:-1.12em;} .table_st_db .unNum.st3{ position:absolute; top:35%; left:50%; margin-left:-1.2em; border:1px solid #666;} .table_st_db.form th{ text-align:left; padding-left:5px; padding-right:5px} .table_st_db.form td{ text-align:left; padding-left:10px; padding-right:10px} .table_st_db.form .ess{ display:inline-block; *display:inline; zoom:1; width:15px; text-align:center} .table_st_db.form .ess .xi:before{ content:"\ea0f"; font-size:.5em; color: #005aa6; line-height:17px} .table_st_db.form .label_st{ margin-left:20px} .table_st_db.form .label_st:first-child{ margin-left:0} .table_st_db .w_form_tit{ width:130px} .table_st_db .w_form{ width:auto} .table_st_db .w_form_tit2{ width:130px} .table_st_db .w_form2{ width:335px} .table_st_db .xi.icon{ width:2em; height:2em; line-height:2em; background:#fff; text-align:center; vertical-align:middle; margin:0 .5em 0 1em; border-radius:100%; overflow:hidden; box-shadow:1px 1px 4px rgba(0,0,0,.3); font-size:1.5em; color:#005aa6; /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#eeeeee+0,ffffff+50,ffffff+50 */ background: rgb(241,241,241); /* Old browsers */ background: -moz-linear-gradient(left, rgba(241,241,241,1) 0%, rgba(255,255,255,1) 40%, rgba(255,255,255,1) 40%); /* FF3.6-15 */ background: -webkit-linear-gradient(left, rgba(241,241,241,1) 0%,rgba(255,255,255,1) 40%,rgba(255,255,255,1) 40%); /* Chrome10-25,Safari5.1-6 */ background: linear-gradient(to right, rgba(241,241,241,1) 0%,rgba(255,255,255,1) 40%,rgba(255,255,255,1) 40%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f1f1f1', endColorstr='#ffffff',GradientType=1 ); /* IE6-9 */} .table_st_db .xi.icon.c1{ color:#888} .table_st_db .xi.icon ~ .tt{ font-size:1.063em; vertical-align:middle} .img_ghs{ width:70px} .img_ghs.list{ width:50px} .tt_st1{ font-size:1.063rem; color:#dd1f28; font-weight:bold} .tt_st2{ font-size:.813rem; color:#777} .tt_icon{ color:#005aa6; padding:0 5px} .tt_icon.more:before{content:"\e980"} .box_st_db{ border:1px solid #ddd; padding:20px; margin-bottom:10px} .inp_st, a.inp_st{ display:inline-block; *display:inline; zoom:1; font-size:.813rem; box-sizing:border-box; height:26px; line-height:22px; padding:0 8px 4px 8px; background:#fff; border:1px solid #005aa6; color:#005aa6; font-weight:bold; border-radius:3px} .inp_st:hover{ box-shadow:0 1px 3px rgba(0,0,0,.2); text-decoration:none !important} .inp_st.w_btn{ width:110px} .inp_st.w_btn2{ width:200px} .inp_st.icon{ text-align:left; position:relative; padding-right:35px} .inp_st.icon .xi{ position:absolute; right:0; top:2px; text-align:center; width:30px} .inp_st.icon .xi.file:before{ content:"\eb7c"} .inp_st.icon .xi.more:before{ content:"\e919"} .inp_st.icon .xi.link:before{ content:"\e980"} .inp_st.s1{ height:40px; line-height:36px; font-size:1rem; letter-spacing:-1px; padding-left:20px; padding-right:20px} .inp_st.s2{ height:32px; line-height:28px; padding-left:20px; padding-right:20px} .inp_st.s3{ font-size:.938em} .inp_st.s4{ height:50px; line-height:46px; font-size:1rem; letter-spacing:-1px; padding-left:30px; padding-right:30px} .inp_st.s5{ height:60px; line-height:56px; font-size:1rem; letter-spacing:-1px; padding-left:30px; padding-right:30px; min-width:180px} .inp_st.c1{ border-color:#aaa; color:#666; background:#f5f5f5} .inp_st.c2{ border-color:#999; color:#fff; background:#999} .inp_st.c3{ border-color:#dd1f28; color:#fff; background:#dd1f28} .inp_st.c4{ border-color:#11b0e9; color:#fff; background:#11b0e9} .inp_st.c5{ border-color:#ccc; color:#666; background:#fff} .inp_st.c6{ border-color:#005aa6; color:#fff; background:#005aa6} .inp_st.w100{ width:100%} .inp_st_form{display:inline-block; *display:inline; zoom:1; vertical-align:middle; font-size:.813rem; box-sizing:border-box; height:40px; line-height:26px; padding:5px 8px 9px 8px; border:1px solid #ccc; color:#333; font-weight:bold; border-radius:3px; transition:.3s} .inp_st_form:hover, .inp_st_form:focus{ background-color:#f5f5f5; border-color:#666} .inp_st_form[type=button], .inp_st_form[type=submit], button.inp_st_form, a.inp_st_form{ height:39px; padding-left:20px; padding-right:20px; background:#f1f1f1} select.inp_st_form{ padding-right:30px; background-size:auto 6px} textarea.inp_st_form{ width:100%; height:100px} .inp_st_form[type=file]{ padding:0; background:none} .inp_st_form.w1{ width:205px} .inp_st_form.w2{ width:95px} .inp_st_form.w3{ width:314px} .inp_st_form.w4{ width:500px} .inp_st_form.w100{ width:100%} .inp_tt{ vertical-align:middle; font-size:.938em; color:#777; line-height:20px} .page_btn_wrap{ text-align:center; margin-top:20px} .page_btn_wrap.st1{ margin-top:40px} .page_btn_wrap.st2{ border-top:1px solid #aaa; padding-top:30px; margin-top:30px} .page_btn_wrap .xi{ vertical-align: middle} .memo_st{ margin-top:10px} .memo_st > li{ margin-top:10px; font-size:.813em; color:#777; position:relative; padding-left:15px; line-height:20px} .memo_st > li:before{ content:""; position:absolute; left:1px; top:6px; width:4px; height:4px; background:#fff; border:3px solid #11b0e9; border-radius:100%} .memo_st > li:first-child{ margin-top:0} .memo_st > li .c1{ color: #FF3333} .memo_st > li .c2{ color: #11b0e9} .di_wrap{ font-size:0} .di_wrap.sec2 > li{ width:50%} .di_wrap > li{ display:inline-block; *display:inline; zoom:1; vertical-align:top; font-size:16px; font-size:1rem} .di_wrap > li > a, .di_wrap > li > .in{ display:block} .page_tit_db{ margin-top:20px; position:relative; padding:5px 0 5px 18px; margin-bottom:5px} .page_tit_db:first-child{ margin-top:0} .idx .page_tit_db:first-child{ margin-top:30px} .page_tit_db:before{content:""; position:absolute; left:0; top:11px; width:5px; height:5px; background:#fff; border:3px solid #005aa6; transform:rotate(45deg)} .page_tit_db .t1{ font-weight: bold; color:#111; font-size:1.063em; letter-spacing:-1px} .page_tit_db .t2{ font-weight:bold; color:#333; font-size:.875em} .page_tit_db .t3{ font-weight:bold; color:#333; font-size:.938em} .page_tit_db .t4{ color:#111; font-size:.938em; display:inline-block; font-family:notokrM, sans-serif; letter-spacing:-1px; padding-top:2px} .page_tit_db .tsub{ display:block; padding:10px 0} .page_tit_db .tsub .tt{ display:block; font-size:.875em; color:#333; margin-top:10px} .page_tit_db .tsub .tt.tt1{ font-size:.813em; color:#666} .page_tit_db .tsub .tt:first-child{ margin-top:0} .page_tit_de_more{ position:relative;} .page_tit_de_more .more{ position:absolute; right:25px; top:0;} .more *{ transition:.3s} .more .more_btn{ display:inline-block; *display:inline; zoom:1; line-height:30px; padding:0 10px; background:#f5f5f5; border:1px solid #ddd; font-size:.813em; font-weight:bold; color:#666; border-radius:3px} .more .more_btn .icon{ padding:0 7px} .more .more_btn .arrow{ padding-left:10px; font-size:1em} .more .more_btn:hover{ background:#11b0e9; color:#fff; border-color:transparent} .more .more_btn:hover .icon{ transform:rotateY(180deg)} .page_tit_de{ margin-top:20px; position:relative; padding:5px 0 5px 20px; margin-bottom:10px} .page_tit_de *{ vertical-align: baseline} .page_tit_de:first-child{ margin-top:0} .page_tit_de:before{content:""; position:absolute; left:0; top:9px; width:10px; height:10px; background:#11b0e9} .page_tit_de:after{content:""; position:absolute; left:2px; top:11px; width:10px; height:10px; border:2px solid #fff; background:#005aa6} .page_tit_de .t1{ font-weight: bold; color:#111; font-size:1.063em; letter-spacing:-1px} .page_tit_de .t2{ font-weight: bold; color:#111; font-size:1em; letter-spacing:-1px; line-height:1.3} .page_tit_de .t3{ color:#666; font-size:.875em} .page_tit_de .t4{ color:#111; font-size:.938em; line-height:1.4} .page_tit_de .t_sub{ font-size:.75rem; color:#666; line-height:1.4; text-indent:-15px; padding-left:15px; margin-top:5px} .page_tit_de2{ margin-top:50px; position:relative; line-height:30px; margin-bottom:10px} .page_tit_de2.mg1{ margin-top:30px} .page_tit_de2:first-child{ margin-top:0} .page_tit_de2:before{ content:""; display:block; width:25px; height:3px; background:#005aa6; border-radius:5px; margin-bottom:5px} .page_tit_de2 .t1{ font-weight: bold; color:#333; font-size:1.188em; letter-spacing:-1px; font-family:notokrB, sans-serif; vertical-align:baseline} .page_tit_de2 .t2{ font-weight: bold; color:#777; font-size:1.063em; letter-spacing:-1px; font-family:notokrM, sans-serif; vertical-align:baseline} .page_tit_de2 .t3{ font-weight: bold; color:#005aa6; font-size:1.063em; letter-spacing:-1px; font-family:notokrB, sans-serif; vertical-align:baseline} .page_tt{ font-size:.875em; color:#666; line-height:1.5} .sub_more{ display:block; border-radius:3px; text-align:center; border:1px solid #ddd; margin-top:10px; transition:.3s} .sub_more .t1{ font-size:.813em; color:#666; font-weight:bold; display:inline-block; line-height:27px; padding-bottom:3px} .sub_more .icon:before{content:"\e917"; font-family:xeicon!important; margin-left:5px; margin-top:2px; color:#005aa6; font-size:.75em; line-height:30px; transition:.3s} .sub_more:hover{ background:#f9f9f9; border-color:#aaa; color:#333} .sub_more:hover .t1{ color:#111} .sub_more:hover .icon:before{ transform:rotate(180deg)} /**/ .sub_business_tit{ position:relative} .sub_business_tit .in{ padding:30px 150px 35px 30px; border:1px solid #ccc; border-left:none; border-top:3px solid #005aa6; border-radius:0 0 10px 10px; box-shadow:0 1px 3px rgba(0,0,0,.2); background:url(../images/subN/2_tit_bg.png) no-repeat right bottom #fff} .sub_business_tit .in .t1{ font-family:notokrM, sans-serif; font-size:1.438em; letter-spacing:-2px; color:#222} .sub_business_tit .in .t2{ font-size:.938em; color:#666; margin-top:12px; font-weight:600; line-height:1.5; padding-left:1px} .sub_business_tit.st1{ font-size:.875em} .sub_business_tit.st1 .in{ background:none; padding:25px 30px} .sub_business_tit.st1 .in .t1{ letter-spacing:-1px} .sub_business_tit.st1 .in .t2{ font-weight:normal; line-height:1.3} .sub_info_tit{ position:relative} .sub_info_tit .in{ padding:20px 20px; border-top:3px solid #005aa6; border-radius:0 0 10px 10px; box-shadow:0 1px 5px rgba(0,0,0,.2); background: rgb(245,245,245); /* Old browsers */ background: -moz-linear-gradient(bottom, rgba(245,245,245,1) 0%, rgba(255,255,255,1) 40%, rgba(255,255,255,1) 40%); /* FF3.6-15 */ background: -webkit-linear-gradient(bottom, rgba(245,245,245,1) 0%,rgba(255,255,255,1) 40%,rgba(255,255,255,1) 40%); /* Chrome10-25,Safari5.1-6 */ background: linear-gradient(to top, rgba(245,245,245,1) 0%,rgba(255,255,255,1) 40%,rgba(255,255,255,1) 40%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#f5f5f5',GradientType=1 ); /* IE6-9 */ } .sub_info_tit .in > dt{ display:inline-block; vertical-align:middle; width:8em; max-width:12%; text-align:center;} .sub_info_tit .in > dd{ display:inline-block; vertical-align:middle; width:85%;} .sub_info_tit .in .no{ font-family:notokrM, sans-serif; font-size:1.500em; color:#fff; display:inline-block; width:3em; line-height:3em; background:#005aa6; border-radius:100%;} .sub_info_tit .in .t1{ font-family:notokrB, sans-serif; font-size:1.500em; letter-spacing:-1px; color:#222} .sub_info_tit .in .t2{ color:#666; margin-top:10px; line-height:1.3; padding-left:1px} .sub_tbox_wrap{ margin-top:40px} .sub_tbox_wrap.mg1{ margin-top:20px} .sub_tbox_wrap .sub_tbox_con{ padding:0 0 0 20px} .sub_tbox_con.st1{ margin:15px 40px 40px 25px} .sub_tbox{ font-size:0; margin:0 -15px -15px 0} .sub_tbox > li{ width:100%} .sub_tbox.sec2 > li{ width:50%} .sub_tbox.sec3 > li{ width:33.33%} .sub_tbox.sec4 > li{ width:25%} .sub_tbox.sec5 > li{ width:20%} .sub_tbox > li{ display:inline-block; *display:inline; zoom:1; vertical-align:top; font-size:16px; font-size:1rem} .sub_tbox > li .in{ margin:0 15px 15px 0; padding-top:15px} .sub_tbox.st1 > li > .in{ border:1px solid #ddd; border-radius:5px; padding:10px; min-height:3em} .sub_tbox.st2{ border:1px solid #ddd; border-radius:5px; text-align:center; margin:10px 0; padding-top:10px} .sub_tbox.st3{background:#f5f5f5; border:1px solid #ddd; border-left:none; border-right:none; padding:20px 30px 40px 30px} .sub_tbox.st4 > li > .in{ padding-top:0; margin-top:-10px; margin-left:-3px} .sub_tbox > li.wide{ width:100%} .sub_tbox > li .in .img_wrap{ text-align:center} .sub_tbox > li .in .img_wrap .icon{ display:inline-block; *display:inline; zoom:1; width:100px; height:100px; border-radius:100%; overflow:hidden; box-shadow:1px 1px 4px rgba(0,0,0,.3); /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#eeeeee+0,ffffff+50,ffffff+50 */ background: rgb(241,241,241); /* Old browsers */ background: -moz-linear-gradient(left, rgba(241,241,241,1) 0%, rgba(255,255,255,1) 40%, rgba(255,255,255,1) 40%); /* FF3.6-15 */ background: -webkit-linear-gradient(left, rgba(241,241,241,1) 0%,rgba(255,255,255,1) 40%,rgba(255,255,255,1) 40%); /* Chrome10-25,Safari5.1-6 */ background: linear-gradient(to right, rgba(241,241,241,1) 0%,rgba(255,255,255,1) 40%,rgba(255,255,255,1) 40%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f1f1f1', endColorstr='#ffffff',GradientType=1 ); /* IE6-9 */ } .sub_tbox > li .in .img_wrap .icon img{ width:50%} .sub_tbox > li .in .tit_wrap{ padding:15px 5px} .sub_tbox > li .in .tit_wrap:first-child{ padding-top:5px; padding-bottom:10px} .sub_tbox > li .in .tit_wrap .t1{ font-size:.875em; color:#444; font-weight:600; line-height:1.3; text-align:center} .sub_tbox > li .in .tit_wrap .t2{ font-size:.813em; color:#666; font-weight:600; line-height:1.3; text-align:center } .sub_tbox > li .in .tit_wrap .t3{ font-size:.875em; color:#444; font-weight:600; line-height:1.4; position:relative; padding:0 15px; margin-top :15px} .sub_tbox > li .in .tit_wrap .t3:first-child{ margin-top:0} .sub_tbox > li .in .tit_wrap .t3:before{ content:""; position:absolute; width:3px; height:3px; transform:rotate(45deg); left:0; top:7px; background:#fff; border:2px solid #005aa6; border-right-color:#11b0e9; border-top-color:#11b0e9} .sub_tbox > li .in .tit_wrap .t4{ font-size:.813em; line-height:1.3; color:#666; position:relative; padding:0 25px; margin-top:10px} .sub_tbox > li .in .tit_wrap .t4:before{ content:""; position:absolute; width:4px; height:4px; background:#11b0e9; left:17px; top:6px;} .sub_tbox > li .in .tit_wrap .small{ font-size:.875em; opacity:.7; vertical-align:baseline} .sub_tbox > li .in .tit_wrap .t5{font-size:.813em; color:#666; line-height:1.4; margin-top:5px} .sub_tbox > li .in .tit_wrap .t5.line{ text-indent:-10px; padding-left:10px} .sub_tbox > li .in .tit_wrap .t6{font-size:.875em; color:#333; line-height:1.4; margin:10px 0} .sub_tbox > li .in .tit_wrap .t6:first-child{ margin-top:0} .sub_tbox_wrap2{ margin-top:30px} .sub_tbox_wrap2:first-child{ margin-top:0} .sub_tbox_wrap2.st1{ padding:0 20px 10px 20px} .sub_tbox_wrap2_tit{ background:#f9f9f9; border-top:1px solid #aaa; border-bottom:1px solid #ddd; padding:14px 0; font-size:.938em; text-align:center; font-weight:bold} .sub_tbox_wrap2_tit .t2{ font-size:.938em; font-weight:normal;} .sub_tbox_wrap2_tit > *{ vertical-align:middle;} .sub_tbox2{ padding:0 22px} .sub_tbox2 .tt_wrap{ margin-top:20px} .sub_tbox2 .tt_wrap.mg1{ margin-top:40px; margin-bottom:-10px} .sub_tbox2 .tt_wrap.mg2{ margin-top:10px} .sub_tbox2 .tt_wrap:first-child{ margin-top:0} .sub_tbox2 .tt_wrap.icon{ position:relative; padding:0 15px} .sub_tbox2 .tt_wrap.icon:before{ content:""; position:absolute; width:4px; height:4px; transform:rotate(45deg); left:0; top:8px; background:#fff; border:2px solid #005aa6; border-right-color:#11b0e9; border-top-color:#11b0e9} .sub_tbox2 .box_st1{ border:1px solid #ddd; border-radius:5px; padding:15px 20px} .sub_tbox2 .box_st1 > *:first-child{ margin-top:0} .sub_tbox2 .tt_wrap2{ margin-top:15px} .sub_tbox2 .tt_wrap2.mg{ margin-top:30px} .sub_tbox2 .tt_wrap2 > *{ margin-top:5px} .sub_tbox2 .tt_wrap2 > *:first-child{ margin-top:0} .sub_tbox2 .tt_wrap2.icon{ position:relative; padding:0 10px} .sub_tbox2 .tt_wrap2.icon:before{ content:""; position:absolute; width:5px; height:5px; background:#005aa6; left:0; top:7px;} .sub_tbox2 .tt_wrap3{ margin-top:10px} .sub_tbox2 .tt_wrap3 > *{ margin-top:5px} .sub_tbox2 .tt_wrap3 > *:first-child{ margin-top:0} .sub_tbox2 .tt_wrap3.icon{ position:relative; padding:0 10px} .sub_tbox2 .tt_wrap3.icon:before{ content:""; position:absolute; width:4px; height:4px; background:#11b0e9; border-radius:100%; left:0; top:6px;} .sub_tbox2 .tt_wrap .t1{ font-size:.875rem; color:#111; line-height:1.5} .sub_tbox2 .tt_wrap .t1 strong{ font-size:1.063em} .sub_tbox2 .tt_wrap .t2{ font-size:.813rem; color:#444; line-height:1.3} .sub_tbox2 .tt_wrap .t2.st1{ line-height:1.5} .sub_tbox2 .tt_wrap .t2.st2{ font-size:.875rem; margin-left:-10px; margin-bottom:10px} .sub_tbox2 .tt_wrap .t3{ font-size:.75rem; color:#666 } .sub_tbox2 .tt_wrap .t_sub{ font-size:.75rem; color:#666; line-height:1.4; text-indent:-15px; padding-left:15px; margin-top:5px} .sub_tbox2 .tt_wrap .t_sub.e1{ text-indent:-10px; padding-left:10px;} .sub_tbox2 .tt_wrap .t_sub.e2{ text-indent:-15px; padding-left:15px;} .sub_tbox2 .tt_wrap .t_sub.e1_n{ text-indent:0; padding-left:10px;} .sub_tbox_wrap2 .ess{ display:inline-block; margin-top:-2px; text-indent:0; font-size:.5em; color: #005aa6; vertical-align:middle} .sub_tbox_wrap2 .ess:before{ content:"\ea0f"; font-family:xeicon!important} .sub_tbox2 .img_wrap{ border:1px solid #ddd; padding:20px; border-radius:5px; position:relative; margin-top:5px !important} .sub_tbox2 .img_wrap .tit{ position:absolute; left:0; top:-15px; width:100%; line-height:30px} .sub_tbox2 .img_wrap .tit > span{ display:inline-block; *display:inline; zoom:1; padding:0 20px; margin:0 20px; background:#fff; font-size:.875em; color:#333; font-weight:bold; position:relative} .sub_tbox2 .img_wrap .tit > span:before, .sub_tbox2 .img_wrap .tit > span:after{ content:""; position:absolute; width:6px; height:6px; border-radius:100%; background:#666; top:12px} .sub_tbox2 .img_wrap .tit > span:before{ left:0} .sub_tbox2 .img_wrap .tit > span:after{ right:0} .sub_tbox2 .img_wrap.pd1{ padding:0} .sub_tbox2 .small{ font-size:.938em; vertical-align:baseline} .sub_tbox2.st1{ border:1px solid #ddd; padding:30px 20px; border-radius:5px; box-shadow:2px 2px 6px rgba(0,0,0,.1)} .sub_tbox2.st2, .sub_tbox2.st2 *[class^="tt_wrap"]{ padding-right:0;} .sub_tbox3{ margin-top:20px} .sub_tbox3:first-child{ margin-top:0} .sub_tbox3 > dt{ font-size:.875em; color:#111; font-weight:bold} .sub_tbox3 > dd{ font-size:.813em; padding:5px 25px; color:#666; line-height:1.5} .sub_tbox3 .in{ margin-top:10px} .sub_tbox3 .in:first-child{ margin-top:3px} .sub_tbox3 .in > dt{ color:#005aa6; font-weight:bold; position:relative; margin-bottom:5px} .sub_tbox3 .in > dt:before{ content:""; position:absolute; left:-6px; top:8px; width:3px; height:3px; background:#005aa6} .sub_tbox3 .in > dd{} .sub_tbox3 .in2{ margin-top:10px} .sub_tbox3 .in2:first-child{ margin-top:5px} .sub_tbox3 .in2 > dt{ color:#11b0e9; padding-left:10px; position:relative} .sub_tbox3 .in2 > dt:before{ content:""; position:absolute; left:2px; top:9px; width:5px; height:1px; background:#11b0e9} .sub_tbox3 .in2 > dd{ padding-left:12px} .sub_tbox3 a{ text-decoration:underline} .sub_tbox3 > dt a{ color:#111} .sub_tbox3 > dd a{ color:#666} .sub_tbox4{ border:1px solid #ccc; margin-top:30px; border-radius:5px; box-shadow:0 1px 3px rgba(0,0,0,.2)} .sub_tbox4 .tit{ border-radius:4px 4px 0 0; border-bottom:1px dashed #aaa; padding:20px; font-weight:bold; font-family:notokrM, sans-serif; font-size:1.125em; color:#002654; letter-spacing:-1px; word-spacing:2px; padding-bottom:15px} .sub_tbox4 .twrap{ padding:5px 23px} .sub_tbox4 .page_tit_db{ margin-top:0} .ol_st > li{ list-style:decimal; margin-left:20px; margin-top:10px} .ol_st.disc > li{ list-style:disc} .ol_st.tp1 > li{ list-style:upper-alpha} .ol_st.tp2 > li{ list-style:lower-roman } .ol_st.st1{ margin:5px 0} .ol_st.st1 .ol_st.st1{ margin:7px 0 10px 0} .ol_st.st1 > li{ margin-top:7px; line-height:1.5} .ol_st.st1 > li:first-child{ margin-top:0} .imgbox_st{ font-size:0} .imgbox_st > li{ width:100%} .imgbox_st.sec2 > li{ width:50%} .imgbox_st.sec3 > li{ width:33.33%} .imgbox_st.sec4 > li{ width:25%} .imgbox_st.sec5 > li{ width:20%} .imgbox_st.sec7 > li{ width:14.28%} .imgbox_st > li{ display:inline-block; *display:inline; zoom:1; vertical-align:top; font-size:16px; font-size:1rem} .imgbox_st > li .in{ } .imgbox_st > li .in .img{ text-align:center} .imgbox_st > li .in .img .icon{ display:inline-block; *display:inline; zoom:1; width:100px; height:100px; border-radius:100%; overflow:hidden; box-shadow:1px 1px 4px rgba(0,0,0,.3); margin-top:10px; /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#eeeeee+0,ffffff+50,ffffff+50 */ background: rgb(241,241,241); /* Old browsers */ background: -moz-linear-gradient(left, rgba(241,241,241,1) 0%, rgba(255,255,255,1) 40%, rgba(255,255,255,1) 40%); /* FF3.6-15 */ background: -webkit-linear-gradient(left, rgba(241,241,241,1) 0%,rgba(255,255,255,1) 40%,rgba(255,255,255,1) 40%); /* Chrome10-25,Safari5.1-6 */ background: linear-gradient(to right, rgba(241,241,241,1) 0%,rgba(255,255,255,1) 40%,rgba(255,255,255,1) 40%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f1f1f1', endColorstr='#ffffff',GradientType=1 ); /* IE6-9 */ } .imgbox_st > li .in .img .icon .xi{ font-size:1.875em; color:#aaa} .imgbox_st > li .in .img .icon img{ width:50%} .imgbox_st > li .in .tit{ padding:15px 5px} .imgbox_st > li .in .tit:first-child{ padding-top:5px; padding-bottom:10px} .imgbox_st > li .in .tit .t1{ font-size:.875em; color:#005aa6; font-weight:600; line-height:1.3; text-align:center; margin-bottom:15px} .imgbox_st > li .in .tit .t2{ font-size:.75em; color:#666; line-height:1.2; text-align:left; margin-top:10px; text-indent:-10px; padding-left:10px} .imgbox_st > li .in .tit .t3{ font-size:.813em; color:#333; font-weight:600; text-align:center} .imgbox_st.st1{ adding:0 1px 1px 0} .imgbox_st.st1 > li .in{ margin:0 -1px -1px 0; border:1px solid #ddd; padding:5px} .imgbox_st.step{ margin:0 -20px 0 0} .imgbox_st.step > li .in{ margin:0 20px 0 0; position:relative} .imgbox_st.step > li .in .img .icon{ width:80px; height:80px} .imgbox_st.step > li .in:before{ content:"\e93f"; font-family:xeicon!important; width:20px; text-align:center; position:absolute; left:-20px; top:35px; font-size:1.5em; color:#ddd} .imgbox_st.step > li:first-child .in:before{ display:none} .imgbox_st > li .in.empty{ background: url(../images/inc/logo.svg) no-repeat center #f9f9f9; background-size:30% auto} .c_black{ color:#111} .c_blue{ color:#005aa6} .c_skyblue{ color:#11b0e9} .qt_wrap{ position:relative; padding:25px; margin-bottom:60px; border-radius:10px 10px 0 10px; background:#fff; border-top:2px solid #ddd; box-shadow:-1px -1px 3px rgba(0,0,0,.1)} .qt_wrap *{ position:relative} .qt_wrap:before{ content:""; position:absolute; right:0; bottom:-50px; width: 0; height: 0; border-top: 50px solid #fff; border-left: 50px solid transparent} .qt_wrap .t1{ font-size:.75em; text-align:center; color:#11b0e9} .qt_wrap .t2{ color:#111; font-size:.938em; text-align:center; margin-top:7px} .qt_wrap.re{ border-radius:10px 10px 10px 0} .qt_wrap.re:before{ left:0; border-left:none; border-right:50px solid transparent} .at_wrap{ border-radius:50px; padding:10px 50px; text-align:center; background:#11b0e9} .at_wrap .t1{ color:#fff; font-size:.875em} .at_wrap .t2{ color:#fff; color:#fff; font-weight:bold; margin-top:5px; font-size:1.063em} .st1 .at_wrap{ margin:0 auto; max-width:650px} .sub_tbox > li .in.icon{ padding-right:100px; position:relative; overflow:hidden} .sub_tbox > li .in.icon .in_icon{ position:absolute; right:-15px; bottom:-10px; opacity:.1; color:#666; line-height:1; font-size:5.5em} .sub_tbox > li .in.icon.st1{ padding:1em; background:#f7f7f7; border-radius:0 0 10px 10px; margin-top:-1.063em} .file_down_tit{ border-bottom:1px dashed #ccc; padding:0 0 .5em 1em; font-size:.875em; font-weight:bold; color:#333; border-radius:5px} .file_down_tit .xi{ margin:-1px .25em 0 0} .file_down{ margin:-4em 0 0 -4em; padding:.25em 1em} .file_down:after{ content:""; display:block; clear:both} .file_down > li{ float:left; width:25%} .file_down > li .in{ margin:4em 0 0 4em; cursor:pointer} .file_down > li .in .img{ height:0; padding-bottom:137.7443%; position:relative; box-shadow:1px 1px 3px rgba(0,0,0,.3)} .file_down > li .in .img .layer{ position:absolute; left:0; top:0; width:100%; height:100%; background:rgba(0,0,0,.4); display:flex; align-items:center; justify-content:center; transition:.3s; opacity:0; visibility:hidden} .file_down > li .in .img .layer .xi{ width:2em; height:2em; line-height:2em; background:#fff; border-radius:100%; text-align:center; transition:.3s} .file_down > li .in .con{ padding:.5em 0; text-align:center} .file_down > li .in .con .tit{ font-size:.75em; color:#666} .file_down > li .in:hover .img .layer{ opacity:1; visibility:visible} .file_down > li .in:hover .img .layer .xi{ transform:rotate(360deg)} .file_down > li .in:hover .con .tit{ color:#111} .sub_tbox > li.flex{ display:flex} .sub_tbox > li.flex .in{ flex:1 1 auto; margin-top:0 !important} .sub_tbox > li.flex .in.st1{ flex:0 0 8em; border-radius:5px} .sub_tbox > li.flex .in.st1 .file_down{ margin:0; padding:0} .sub_tbox > li.flex .in.st1 .file_down > li{ width:100%; float:none} .sub_tbox > li.flex .in.st1 .file_down > li .in{ margin:0} .page_cs_wrap{ padding:20px; background:#fff; border:3px solid #ddd; margin-top:40px; position:relative; line-height:20px} .page_cs_wrap:before, .page_cs_wrap:after{ content:""; position:absolute; width:25px; height:25px; border:3px solid #11b0e9;} .page_cs_wrap:before{ left:-3px; top:-3px; border-right:none; border-bottom:none} .page_cs_wrap:after{ right:-3px; bottom:-3px; border-left:none; border-top:none} .page_cs_wrap .t1{ font-weight:bold; font-size:.813em; color:#005aa6; padding-right:10px} .page_cs_wrap .t2{ font-size:.813em; color:#333; padding-right:10px; margin-right:10px; position:relative} .page_cs_wrap .t2:before{ content:""; position:absolute; right:0; top:20%; width:1px; height:60%; background:#ddd} .page_cs_wrap .t2:last-child:before{ display:none} .page_cs_wrap .t2 .xi{ font-size:1.25em; color:#aaa; padding-right:5px} /**/ .sub_history_wrap{ position:relative} .sub_history_wrap .wrap_line{ position:absolute; left:50%; top:20px; width:1px; height:100%; background:#ccc; margin-left:-1px} .sub_history_wrap .wrap_dot{ position:absolute; width:5px; height:5px; border:3px solid #11b0e9; background:#fff; left:50%; bottom:-20px; border-radius:100%; margin:0 0 0 -6px} .sub_history_wrap .list > li{ padding:20px 0; margin-top:-10px} .sub_history_wrap .list > li:first-child{ margin-top:0} .sub_history_wrap .list > li .year{ width: 60px; line-height: 40px; position: relative; text-align:center; margin:0 auto 15px auto;} .sub_history_wrap .list > li .year:before {content: ""; position: absolute; top: -13px; left: 0; width: 0; height: 0; border-left: 30px solid transparent; border-right: 30px solid transparent; border-bottom: 13px solid #0095cb} .sub_history_wrap .list > li .year:after { content: ""; position: absolute; bottom: -13px; left: 0; width: 0; height: 0; border-left: 30px solid transparent; border-right: 30px solid transparent; border-top: 13px solid #11b0e9} .sub_history_wrap .list > li .year .bg{ position:absolute; left:0; top:0; width:100%; height:100%; /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#0095cb+0,0095cb+49,11b0e9+50,11b0e9+50,11b0e9+100 */ background: rgb(0,149,203); /* Old browsers */ background: -moz-linear-gradient(-45deg, rgba(0,149,203,1) 0%, rgba(0,149,203,1) 49%, rgba(17,176,233,1) 50%, rgba(17,176,233,1) 50%, rgba(17,176,233,1) 100%); /* FF3.6-15 */ background: -webkit-linear-gradient(-45deg, rgba(0,149,203,1) 0%,rgba(0,149,203,1) 49%,rgba(17,176,233,1) 50%,rgba(17,176,233,1) 50%,rgba(17,176,233,1) 100%); /* Chrome10-25,Safari5.1-6 */ background: linear-gradient(135deg, rgba(0,149,203,1) 0%,rgba(0,149,203,1) 49%,rgba(17,176,233,1) 50%,rgba(17,176,233,1) 50%,rgba(17,176,233,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0095cb', endColorstr='#11b0e9',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */ } .sub_history_wrap .list > li .year .tt{ position:relative; font-family:Verdana, Helvetica, sans-serif; font-size:.938em; color:#fff; font-weight:bold; letter-spacing:-1px; text-shadow:1px 1px 2px rgba(0,0,0,.3)} .sub_history_wrap .list > li .detail{ width:50%; margin-left:50%; position:relative} .sub_history_wrap .list > li .detail .in{ border:1px solid #ddd; border-radius:0 10px; margin:5px 30px; background:#fff; position:relative; padding:10px 10px 10px 40px; overflow:hidden} .sub_history_wrap .list > li .detail .in .month{ position:absolute; width:30px; height:100%; left:0; top:0; font-weight:bold; font-size:.875em; color:#005aa6; text-align:center; border-right:1px solid #ddd; background:#f9f9f9} .sub_history_wrap .list > li .detail .in .tt{ font-size:.813em; color:#333} .sub_history_wrap .list > li .detail:before{ content:""; position:absolute; left:0; top:50%; width:30px; height:1px; background:#ddd} .sub_history_wrap .list > li .detail:after{ content:""; position:absolute; left:-3px; top:50%; width:6px; height:6px; margin-top:-3px; background:#11b0e9; transform:rotate(45deg)} .sub_history_wrap .list > li:nth-child(2n) .year .bg{transform:rotateY(180deg)} .sub_history_wrap .list > li:nth-child(2n) .detail{margin-left:0; text-align:right} .sub_history_wrap .list > li:nth-child(2n) .detail .in{ border-radius:10px 0; padding-left:10px; padding-right:40px} .sub_history_wrap .list > li:nth-child(2n) .detail .in .month{ left:auto; right:0; border-right:none; border-left:1px solid #ddd} .sub_history_wrap .list > li:nth-child(2n) .detail:before{ left:auto; right:0} .sub_history_wrap .list > li:nth-child(2n) .detail:after{ left:auto; right: -3px} .sub_staff_wrap{ font-size:0; margin:0 -15px -15px 0} .sub_staff_wrap > li{ display:inline-block; *display:inline; zoom:1; vertical-align:top; font-size:16px; font-size:1rem; width:20%} .sub_staff_wrap.big > li{ width:40%} .sub_staff_wrap > li .in{ margin:0 15px 15px 0; border:1px solid #ddd; border-radius:5px; text-align:center; box-shadow:1px 1px 3px rgba(0,0,0,.1)} .sub_staff_wrap > li .in .img{ margin:15px auto; display:block; width:70px; border:3px solid #fff; border-radius:3px; box-shadow:0 0 5px rgba(0,0,0,.3)} .sub_staff_wrap > li .in .tit{ background:#f5f5f5; border-bottom:1px solid #ddd; font-weight:bold; color:#333; font-size:.875em; padding:8px 0; border-radius:5px 5px 0 0} .sub_staff_wrap > li .in .info{ padding:8px 0; border-top:1px solid #ddd} .sub_staff_wrap > li .in .info .t1{ font-size:.813em; color:#005aa6} .sub_staff_wrap > li .in .info .t2{ font-size:.75em; color:#777; padding-top:3px} .sub_staff_wrap > li .in .info br{ display:none} .board_list_finish{ font-size:0; margin:0 -15px 0 0} .board_list_finish > li{ display:inline-block; *display:inline; zoom:1; vertical-align:top; font-size:16px; font-size:1rem; width:25%} .board_list_finish > li .in{ display:block; margin:0 15px 15px 0; border:1px solid #ddd; border-radius:5px; transition:.3s} .board_list_finish > li .in:hover{ border-color:#666} .finish_wrap *{ transition:.3s} .finish_wrap{ overflow:hidden; cursor:pointer; position:relative} .finish_wrap .tit_wrap{ padding:0 5px; text-align:left; height:65px} .finish_wrap .tit_wrap .va_tt{ width:95%} .finish_wrap .tit_wrap .cate{ display:inline-block; *display:inline; zoom:1; padding:0 10px; font-size:.75em; font-weight:bold; color:#fff; height:20px; line-height:18px; border-radius:2px; margin-bottom:3px} .finish_wrap .tit_wrap .cate.c1{ background:#5eb600} .finish_wrap .tit_wrap .cate.c2{ background:#44a4e4} .finish_wrap .tit_wrap .cate.c3{ background:#5a81da} .finish_wrap .tit_wrap .t1{ display:block; line-height:20px; font-weight:bold; font-size:.938em; color:#333; letter-spacing:-1px; text-overflow:ellipsis; white-space:nowrap; overflow:hidden} .finish_wrap .img_wrap{ background:#f5f5f5; border:1px solid #ddd; border-left:none; border-right:none; background:url(../images/inc/logo_gray2.png) no-repeat center center #f9f9f9; background-size:30% auto; overflow:hidden; position:relative} .finish_wrap .img_wrap img{ width:100%} .finish_wrap .img_wrap:after{ content:""; position:absolute; left:0; top:0; width:100%; height:100%; background:#fff; opacity:0; transition:.3s} .finish_wrap .info_wrap{ margin:5px 15px 15px 15px; position:relative} .finish_wrap .info_wrap .dday{position:absolute; right:0; bottom:-2px; width:90px; text-align:right; overflow:hidden; font-family:Verdana, Arial, Helvetica, sans-serif; font-size:1.125em; font-weight:bold; letter-spacing:-1px} .finish_wrap .info_wrap .dday + .info{ padding-right:90px} .finish_wrap .info_wrap .t1{ color:#999; font-size:.75em; font-weight:bold; line-height:25px} .finish_wrap .info_wrap .t2{ color:#333; font-size:.875em; font-weight:bold; letter-spacing:-1px} .finish_wrap .info_wrap .dday .c1{ color:#aaa} .finish_wrap .info_wrap .dday .c2{ color:#005aa6} .finish_wrap .info_wrap .date{ line-height:30px; padding:10px} .finish_wrap .info_wrap .date .xi{ color:#bbb; font-size:2em;} .finish_wrap .info_wrap .date .no{ font-family:Verdana, Arial, Helvetica, sans-serif; font-size:1.5em; color:#005aa6; font-weight:bold; letter-spacing:-1px} .finish_wrap .layer{ position:absolute; left:0; top:0; width:100%; height:100%; opacity:0} .finish_wrap .layer .xi{ display:block; font-size:3em; color:#005aa6; margin-left:30px} .finish_wrap .layer .xi:before{content:"\e97a"} .finish_wrap .layer .tt{ display:block; font-size:.813em; font-weight:bold; margin-right:30px; color:#005aa6} .finish_wrap:hover .img_wrap:after{ opacity:.7;} .finish_wrap:hover .layer{ opacity:1;} .finish_wrap:hover .layer .xi{ margin-left:0} .finish_wrap:hover .layer .tt{ margin-right:0} .finish_wrap.st1{ cursor:default} .finish_wrap.st1 .tit_wrap{ height:60px} .finish_wrap.st1 .tit_wrap .t1{ font-size:.875em} .finish_wrap.st1 .tit_wrap .t2{ font-size:.813em} .finish_wrap.st1:hover .img_wrap:after{ opacity:0;} .finish_wrap.st1:hover .layer{ opacity:0;} .select_de_tit{display:inline-block; *display:inline; zoom:1; line-height:40px; vertical-align:top; padding-right:5px} .select_de_tit .xi{ font-size:1.625em; color:#005aa6; padding-right:3px} .select_de_tit .t1{ font-weight:bold; font-size:1em; color:#333; letter-spacing:-1px} .select_de_wrap{ text-align:right; margin-bottom:20px} .select_de{ display:inline-block; *display:inline; zoom:1; line-height:40px; font-size:.875rem; position:relative; z-index:1; text-align:left} .select_de *{ transition:.3s} .select_de > .tit{ display:block; padding:0 50px 0 20px; border:1px solid #ddd; position:relative; font-weight:bold; color:#111; border-radius:3px} .select_de > .tit:before{ content:"\e942"; font-family:xeicon!important; position:absolute; right:10px; top:0} .select_de > .list{ position:absolute; left:0; width:100%; padding:5px 0; opacity:0; visibility:hidden} .select_de > .list > ul{ border:1px solid #ddd; background:#fff; border-radius:3px; box-shadow:0 1px 3px rgba(0,0,0,.2)} .select_de > .list > ul > li{ position:relative} .select_de > .list > ul > li > a{ display:block; padding:0 20px; color:#666; border-top:1px solid #eee; font-size:.938em; position:relative; overflow:hidden} .select_de > .list > ul > li > a:before{ content:"\e93f"; font-family:xeicon!important; position:absolute; right:-10px; top:0; color:#999; transition:.3s} .select_de > .list > ul > li:first-child > a{ border-top:none} .select_de > .list > ul > li:hover > a{ background:#f9f9f9; font-weight:bold; color:#111} .select_de > .list > ul > li:hover > a:before{ right:10px} .select_de > .list > ul > li.on > a{ background:#11b0e9; color:#fff; font-weight:bold} .select_de > .list > ul > li.on > a:before{ color:#fff; right:10px} .select_de > .list > ul > li.on:after{ content:""; position:absolute; z-index:1; top:0; left:-1px; border:1px solid #11b0e9; border-top:none; border-bottom:none; border-radius:3px; width:100%; height:100%} .select_de.w1{ width:140px} .select_de:hover .tit{ border-color:#333} .select_de:hover .list{ opacity:1; visibility:visible} /**/ .login_wrap2{ background:#fff; border-bottom:1px solid #aaa} .login_wrap2 .tit_wrap{ text-align:center; padding:35px 0} .login_wrap2 .tit_wrap .t1{ font-family:notokrM, sans-serif; font-size:1.625em; color:#111; letter-spacing:-2px; word-spacing:3px; margin-bottom:15px} .login_wrap2 .tit_wrap .t2{ font-size:.875em; line-height:1.6; color:#777; margin-top:5px;} .login_wrap2 .tit_wrap .t3{ font-size:.938em; line-height:1.6; color:#005aa6; margin-top:5px; font-weight:bold} .login_wrap2 .tit_wrap.st1{ padding:50px 0 70px 0} .login_wrap2 .tit_wrap.st1 .t1{ margin-bottom:30px} .login_wrap2 .login_box_wrap{ padding:50px 200px; background:#f9f9f9; border-top:1px solid #ccc} .login_wrap2 .login_box{} .login_wrap2 .login_box .in{position:relative; padding-right:130px} .login_wrap2 .login_box .inp_wrap{ position:relative; line-height:30px; padding-left:120px; margin-top:10px} .login_wrap2 .login_box .inp_wrap *{ transition:.3s} .login_wrap2 .login_box .inp_wrap:first-child{ margin-top:0} .login_wrap2 .login_box .inp_wrap .inp{ width:100%; box-sizing:border-box; border:1px solid #ccc; border-radius:5px; padding:10px 15px; font-weight:bold; color:#111; font-family:Tahoma,Arial, Helvetica, sans-serif} .login_wrap2 .login_box .inp_wrap .inp[disabled="disabled"]{ border:none; background:#ddd} .login_wrap2 .login_box .inp_wrap .tit{ position:absolute; left:0; top:5px; width:120px; font-weight:bold; color:#111; font-size:.938em} .login_wrap2 .login_box .inp_wrap .tit .xi{ width:30px; border:1px solid #ddd; border-radius:100%; text-align:center; background:#fff; color:#aaa; margin-right:5px} .login_wrap2 .login_box .btn_wrap{ position:absolute; right:0; top:0; width:120px; height:100%} .login_wrap2 .login_box .btn_wrap .btn{ position:absolute; right:0; top:0; width:100%; height:100%; background:#005aa6; border-radius:5px; color:#fff; font-weight:bold; border:none; max-height:94px} .login_wrap2 .login_box .btn_wrap *{ transition:.3s} .login_wrap2 .login_box .btn_wrap .btn .xi{ display:block; margin-bottom:3px} .login_wrap2 .login_box .btn_wrap .btn:hover{ box-shadow:0 1px 3px rgba(0,0,0,.3)} .login_wrap2 .login_box .btn_wrap .btn:hover .xi{ transform:rotateY(360deg)} .login_wrap2 .login_box .btn_wrap .btn.st1{ font-size:.875em; background:#999} .login_wrap2 .login_box .btn_wrap .btn.st1 .xi{ display:inline-block; display:inline; zoom:1;} .login_wrap2 .login_box .btn_wrap .btn.st1:hover .xi{transform:rotateY(0)} .login_wrap2 .login_box .in_check{ font-size:.813em; padding:10px 12px 0 12px; margin-bottom:-10px; font-weight:bold; color:#777; text-align:right} .login_wrap2 .login_box .inp_wrap .inp:focus{ background:#f9f9f9; border-color:#666} .login_wrap2 .login_box .inp_wrap .inp:focus + .tit .xi{ background:#11b0e9; border-color:transparent; color:#fff} .login_wrap2 .tt_wrap{ margin-top:30px} .login_wrap2 .tt_wrap .tbox{ background:#f9f9f9; border:1px solid #ddd; border-radius:5px; padding:20px; font-size:.813em; color:#666; line-height:1.6} .login_wrap2 .tt_wrap .link{ } .login_wrap2 .link_wrap{ border-top:1px solid #ccc; font-size:0} .login_wrap2 .link_wrap > li{ display:inline-block; *display:inline; zoom:1; vertical-align:top; font-size:16px; font-size:1rem; width:33.33%} .login_wrap2 .link_wrap > li.w1{ width:66.66%} .login_wrap2 .link_wrap > li .in{ display:block; padding:20px 15px 20px 35px; position:relative} .login_wrap2 .link_wrap > li .in:before{ content:""; position:absolute; left:0; top:15%; width:1px; height:70%; background:#ddd} .login_wrap2 .link_wrap > li:first-child .in:before{ display:none} .login_wrap2 .link_wrap > li .in .icon{ position:absolute; left:15px; top:20px; width:17px; line-height:17px; border-radius:100%; text-align:center; color:#fff; background:#005aa6; font-size:.875em} .login_wrap2 .link_wrap > li .in .icon:before{ content:"\e93f"} .login_wrap2 .link_wrap > li .in .tit{ display:block; font-weight:bold; color:#005aa6; font-size:.875em; margin-bottom:7px} .login_wrap2 .link_wrap > li .in .tt{ display:block; font-size:.75em; color:#666; line-height:1.3} .login_wrap2 .link_wrap > li .in .tt2{ display:block; font-size:.813em; color:#333; line-height:1.3; margin-top:5px} .login_wrap2 .link_wrap > li .in .link{ display:inline-block; *display:inline; zoom:1; border:1px solid #ddd; margin-top:10px; font-size:.75em; color:#333; line-height:20px; padding:0 30px 3px 10px; font-weight:bold; position:relative; border-radius:3px; transition:.3s} .login_wrap2 .link_wrap > li .in .link:after{ content:"\e93f"; font-family:xeicon!important; position:absolute; right:10px; top:1px} .login_wrap2 .link_wrap > li .in .link:hover{ background:#f5f5f5; border-color:#aaa} .login_wrap2.st1{} .login_wrap2.st1 .login_box_wrap{ width:auto; padding:40px 60px 40px 60px; background:#fff} .login_wrap2.st1 .login_box_wrap .list{ font-size:0; margin:0 -20px -20px 0; text-align:center} .login_wrap2.st1 .login_box_wrap .list > li{ display:inline-block; *display:inline; zoom:1; vertical-align:top; font-size:16px; font-size:1rem; width:33.33%} .login_wrap2.st1 .login_box_wrap .list.w1 > li{ width:40%} .login_wrap2.st1 .login_box_wrap .login_box{ margin:0 20px 20px 0; padding:0; border:1px solid #ddd; border-radius:0 0 5px 5px; box-shadow:0 1px 4px rgba(0,0,0,.2); border-top-width:2px; border-top-color:#aaa; background:#fff} .login_wrap2.st1 .login_box_wrap .in{ padding:0; text-align:center; position:relative} .login_wrap2.st1 .login_box_wrap .in:before, .login_wrap2.st1 .login_box_wrap .in:after{ content:""; position:absolute; top:-2px; height:2px; width:0; background:#005aa6; transition:.3s} .login_wrap2.st1 .login_box_wrap .in:before{ right:50%} .login_wrap2.st1 .login_box_wrap .in:after{ left:50%} .login_wrap2.st1 .login_box_wrap .in .tit{ background:#fafafa; line-height:50px; text-align:center; color:#111; font-size:.938em; font-weight:bold; border-bottom:1px solid #ddd} .login_wrap2.st1 .login_box_wrap .in .icon{ width:80px; line-height:80px; margin:20px 0; font-size:2.625em; border-radius:100%; background:#f8fafc; color:#005aa6; border:1px solid #e4eaf0} .login_wrap2.st1 .login_box_wrap .in .tt{ color:#777; font-size:.813em} .login_wrap2.st1 .login_box_wrap .in .tt2{ color:#111; font-size:.875em; margin-top:5px} .login_wrap2.st1 .login_box_wrap .in .btn_wrap2{ padding:20px} .login_wrap2.st1 .login_box_wrap .in .btn_wrap2 .btn{background:#aaa; line-height:40px; color:#fff; font-weight:bold; border:none; border-radius:5px; font-size:.875em; width:100%; transition:.3s} .login_wrap2.st1 .login_box_wrap .in:hover:before, .login_wrap2.st1 .login_box_wrap .in:hover:after{ width:50%} .login_wrap2.st1 .login_box_wrap .in .btn_wrap2 .btn:hover{ background:#005aa6} .login_wrap2 .login_box_wrap.st2 .login_box{ padding:0} .login_wrap2 .login_box_wrap.st2 .login_box .in{ padding:30px} .login_wrap2 .login_box_wrap.st2 .login_box .in .btn_wrap{ position: relative; margin:0 auto; height:50px; width:160px} .member_memo_wrap{ padding:20px; border:1px solid #ddd; margin-top:30px} .agree_wrap{border:1px solid #ddd; border-radius:5px} .agree_wrap .agree_con{ height:200px; overflow-y:scroll} .agree_wrap .agree_con .in{ padding:20px; font-size:.938em} .agree_wrap .agree_check{ text-align:right; padding:5px 30px; border-top:1px dashed #ccc; font-size:.875em; background:#fafafa; font-weight:bold; color:#666} .agree_wrap .agree_check .label_st{margin-left:30px} .agree_wrap .agree_check .label_st:first-child{ margin-left:0} .label_wrap{ overflow:hidden; padding:0 1px 1px 0; position:relative} .label_wrap > li{ float:left; width:20%} .label_wrap > li > label{ display:block; border:1px solid #ddd; margin:0 -1px -1px 0; padding:5px 10px; font-size:.938em} .law_wrap .law_history_wrap{} .law_wrap .law_history{ font-size:0; padding:0 1px 1px 0; position:relative} .law_wrap .law_history:before, .law_wrap .law_history:after{ content:""; position:absolute; right:0; bottom:0; width:1px; height:100%; background:#ddd} .law_wrap .law_history:after{ width:100%; height:1px} .law_wrap .law_history > li{ display:inline-block; *display:inline; zoom:1; vertical-align:top; font-size:16px; font-size:1rem; width:20%} .law_wrap .law_history > li .in{ margin:0 -1px -1px 0; background:#fff; border:1px solid #ddd; height:28px; text-align:left; padding:0 20px} .law_wrap .law_history > li .in .tit{ display:inline-block; *display:inline; zoom:1; width:40px; margin-right:10px; letter-spacing:5px; font-size:.75em; color:#333} .law_wrap .law_history > li .in .tt{ font-size:.813em; color:#666} .law_wrap .law_nav{font-size:0; padding:1px 0 0 1px; margin:25px 0; position:relative} .law_wrap .law_nav:before, .law_wrap .law_nav:after{ content:""; position:absolute; left:0; top:0; width:100%; height:1px; background:#666; z-index:1} .law_wrap .law_nav:after{ top:auto; bottom:0} .law_wrap .law_nav > li{ display:inline-block; *display:inline; zoom:1; vertical-align:top; font-size:16px; font-size:1rem; width:25%} .law_wrap .law_nav > li .in{ display:block; background:#fff; margin:-1px 0 0 -1px; border:1px solid #ccc; height:45px; text-align:left; padding:0 20px; position:relative; overflow:hidden} .law_wrap .law_nav > li .in:before{ content:""; position:absolute; right:-6px; bottom:-6px; width:12px; height:12px; background:#333; transform:rotate(45deg); opacity:0} .law_wrap .law_nav > li .in .tit{ display:inline-block; *display:inline; zoom:1; width:55px; margin-right:10px; font-size:.875em; color:#333; font-weight:bold} .law_wrap .law_nav > li .in .tt{ font-size:.875em; color:#555; font-weight:bold} .law_wrap .law_nav > li .in:hover{ z-index:1; border-color:#666; background:#fafafa} .law_wrap .law_nav > li .in:hover:before{ opacity:1} .law_wrap .law_nav > li .in:hover .tit{ color:#111} .law_wrap .law_nav > li .in:hover .tt{ color:#111} .law_box{ border:1px solid #ddd; padding:30px 20px} .law_box .sCon{ margin-top:30px; padding-top:30px; border-top:1px dashed #aaa} .law_box .sCon:first-child{ padding-top:0; margin-top:0; border-top:none} .law_box .sCon .tit{ font-weight:bold; font-size:1.125em; color:#111; letter-spacing:1px; font-family: notokrB, sans-serif; position: relative} .law_box .sCon .tit .gotop{ position:absolute; right:0; top:0; line-height:20px; padding:0 10px; border:1px solid #ddd; border-radius:3px; font-size:.625em; color:#777} .law_box .sCon .tit .gotop:before{content:"\e912"; font-family:xeicon!important; padding-right:3px} .law_box .sCon .tit .gotop:after{ content:"TOP"; font-family:Arial, Helvetica, sans-serif} .law_box .sCon .tit .gotop:hover{ background:#f9f9f9} .law_tt_wrap .t1{ font-size:.875em; color:#444; margin-top:20px; line-height:1.5} .law_tt_wrap .t1 strong{ vertical-align:baseline} .law_tt_wrap .t2{ font-size:.875em; color:#444; margin-top:8px; text-indent:-19px; padding-left:19px; line-height:1.5} .law_tt_wrap .t3{ font-size:.875em; color:#444; margin-top:8px; text-indent:-16px; padding-left:16px; line-height:1.5} .law_tt_wrap .t_sub{ display:inline-block; text-indent:0; font-size:.938em; color:#777; padding:0 3px; vertical-align:baseline} .law_tt_wrap .t_sub:before{ content:"["; padding-right:2px} .law_tt_wrap .t_sub:after{ content:"]"; padding-left:2px} .law_tt_wrap .t_sub2{ font-size:.813em; color:#666; margin-top:15px; line-height:1.5} .law_tt_wrap .tt_wrap2{ padding:0 20px} .law_tt_wrap .tt_wrap3{ padding:0 22px 8px 22px} .sub_map_wrap .left{ float:left; width:49%} .sub_map_wrap .right{ float:right; width:49%} .sub_contact .contact_icon{ display:block; width:40px; line-height:40px; margin:10px auto; background:#005aa6; color:#fff; font-size:2em; border-radius:100%} .sub_contact .contact_line{ display:inline-block; *display:inline; zoom:1; vertical-align: baseline; padding:2px 15px 4px 15px; color:#fff} .sub_contact .contact_line.subway{ border-radius:50px} .sub_contact .contact_line.bus{ border-radius:5px} .sub_contact .contact_line.subway.c2{ background: #22cc2c} .sub_contact .contact_line.subway.c5{ background: #9933ff} .sub_contact .contact_line.subway.c7{ background:#CC9900} .sub_contact .contact_line.bus.c1{ background:#009933} .sub_contact .contact_line.bus.c2{ background: #5ab400} .sub_contact .contact_line.bus.c3{ background: #3366CC} .sub_ci_grid{ position:relative; background:url(../images/subN/1_5_grid.gif); text-align:center; padding:50px} .sub_ci_grid:after{ content:""; position:absolute; left:0; top:0; width:100%; height:100%; box-sizing:border-box; border:1px solid #ccc} .sub_ci_grid .img{padding-bottom:30%; background-position:center; background-repeat:no-repeat; background-size:contain} .sub_ci_grid.h1{ padding:40px 26%} .sub_ci_list{ font-size:0; margin:0 -30px 30px 0} .sub_ci_list > li{ display:inline-block; *display:inline; zoom:1; vertical-align:top; font-size:16px; font-size:1rem; width:50%} .sub_ci_list > li .in{ display:block; margin:0 30px 30px 0} .sub_ci_list > li .in .sub_ci_tit{ text-align:center; padding:10px 0; font-size:.875em; background:#f9f9f9; border-bottom:1px solid #ddd; font-weight:bold; color:#333} .sub_ci_list > li .in .sub_ci_down{ text-align:center; padding:10px; border-bottom:1px solid #ccc} .sub_ci_list > li .in .sub_ci_down > li{ display:inline-block; *display:inline; zoom:1; width:70px} .sub_ci_list > li .in .sub_ci_down > li > a{ display:block; background:#000; color:#fff; line-height:25px; font-size:.875em; font-weight:bold; background:#005aa6; position:relative; text-align:left; padding:0 30px 0 10px} .sub_ci_list > li .in .sub_ci_down > li > a:before{ content:"\eb7c"; font-family:xeicon!important; position:absolute; right:5px; top:0; font-weight:normal; font-size:1.125em} .sub_ci_list > li .in .sub_ci_down > li > a.c1{ background:#666} .sub_ci_color{ border:1px solid #ccc; padding:15px; overflow:hidden} .sub_ci_color .va_wrap{ height:100px} .sub_ci_color .color{ float:left; width:45%;} .sub_ci_color .color .t1{ font-family:Verdana, Arial, Helvetica, sans-serif; color:#fff} .sub_ci_color .info{ float:right; width:50%; text-align:left; font-family:Arial, Helvetica, sans-serif} .sub_ci_color .info .t1{ font-size:.875em; margin-bottom:20px} .sub_ci_color .info .t2{ font-size:.75em; color:#666; margin-top:7px} .sub_ci_color .info .t2 span{ padding-right:10px} .sub_ci_color.c1 .color{ background:#0065ac} .sub_ci_color.c2 .color{ background:#a0cc3a} .sub_ci_color.c1 .info .t1{ color:#0065ac} .sub_ci_color.c2 .info .t1{ color:#a0cc3a} .sub_cs_detail{ position:relative; margin-bottom:50px; padding:20px 30px; border:1px solid #ddd; margin-top:-1px} .sub_cs_detail:before, .sub_cs_detail:after{ content:""; position:absolute; top:-1px; height:3px; padding:0 1px} .sub_cs_detail:before{ left:-1px; width:100%; background:#0065ac} .sub_cs_detail:after{ left:30px; width:50px; background:#a0cc3a} .sub_cs_detail .tt{ font-size:.875em; color:#111; line-height:1.5} /**/ .canvas_wrap{border:1px solid #ccc; border-radius:5px} .canvas {-moz-user-select: none;-webkit-user-select: none;-ms-user-select: none} .chart_tab_wrap{ position:relative} .chart_tab_wrap .chart_tab{ position:absolute; right:0; top:-5px; z-index:1} .chart_tab{ font-size:0} .chart_tab > li{ display:inline-block; *display:inline; zoom:1; font-size:16px; font-size:1rem} .chart_tab > li > a{ display:block; line-height:40px; border:1px solid #ccc; text-align:center; padding:0 10px; margin-left:-1px; color:#777; /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ffffff+0,dddddd+100 */ background: rgb(255,255,255); /* Old browsers */ background: -moz-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(221,221,221,1) 100%); /* FF3.6-15 */ background: -webkit-linear-gradient(top, rgba(255,255,255,1) 0%,rgba(221,221,221,1) 100%); /* Chrome10-25,Safari5.1-6 */ background: linear-gradient(to bottom, rgba(255,255,255,1) 0%,rgba(221,221,221,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#dddddd',GradientType=0 ); /* IE6-9 */ } .chart_tab > li > a .xi{ text-shadow:1px 1px 2px #fff; font-size:1.5em;} .chart_tab > li > a .xi.chart:before{content:"\eb03"} .chart_tab > li > a .xi.list:before{content:"\e95c"} .chart_tab > li > a .tt{ font-size:.75em; padding-left:5px; font-weight:bold} .chart_tab > li.on > a{ color:#111; /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#cccccc+0,dddddd+100 */ background: rgb(204,204,204); /* Old browsers */ background: -moz-linear-gradient(top, rgba(204,204,204,1) 0%, rgba(221,221,221,1) 100%); /* FF3.6-15 */ background: -webkit-linear-gradient(top, rgba(204,204,204,1) 0%,rgba(221,221,221,1) 100%); /* Chrome10-25,Safari5.1-6 */ background: linear-gradient(to bottom, rgba(204,204,204,1) 0%,rgba(221,221,221,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#cccccc', endColorstr='#dddddd',GradientType=0 ); /* IE6-9 */ } .chart_tab > li:first-child > a{ border-radius:5px 0 0 5px} .chart_tab > li:last-child > a{ border-radius:0 5px 5px 0} .sub_info_other_wrap{ margin:0 -20px -20px 0} .sub_info_other_wrap .in{ margin:0 20px 20px 0} /**/ .info_main .left{ float:left; width:290px} .info_main .right{ float:right; width:900px} .info_main .conbox .in{ padding:20px 30px 0 30px} .info_main .con1{ background:#005aa6; height:550px} .info_main .con2{ background:#eef6e6; height:160px; margin-top:10px; border:1px solid #d8ddc9} .info_main .con3{ background:#edf2f6; height:395px; border:1px solid #ccd6de} .info_main .con3 .in{ padding-top:25px} .info_main .con3 .con_wrap{ float:left; width:570px} .info_main .con3 .slide_wrap{ float:right; width:240px} .info_main .con4{ margin-top:11px} .info_main .con5{ margin-top:11px} .info_main .conbox_tit{ line-height:30px; margin-bottom:10px; position:relative} .info_main .conbox_tit .icon{ width:30px; text-align:center; border-radius:100%; color:#fff; margin-right:5px} .info_main .conbox_tit .tt{ font-size:1.25em; font-family:notokrM, sans-serif; letter-spacing:-1px; color:#111} .info_main .conbox_tit.s1 .tt{ font-size:1.125em} .info_main .conbox_tit.s2 .tt{ font-size:1.063em} .info_main .conbox_tit.c1 .icon{ background:#002654} .info_main .conbox_tit.c1 .tt{ color:#002654} .info_main .conbox_tit.c1.re .icon{ background:none; color:#002654; width:20px; margin-right:2px} .info_main .conbox_tit.c2 .icon{ background:#005aa6} .info_main .conbox_tit.c3 .icon{ background:#777} .info_main .conbox_tit.c4 .icon{ background:#aaa} .info_main .conbox_tit.c5 .icon{ background:#608c33} .info_main .conbox_tit .more_btn{ position:absolute; width:25px; line-height:25px; text-align:center; border-radius:2px; border:1px solid #ddd; right:0; top:0; color:#999; transition:.3s} .info_main .conbox_tit .more_btn:before{content:"\e913"; font-family:xeicon!important} .info_main .conbox_tit .more_btn:hover{transform:rotate(90deg); border-color:#666; color:#666} .info_main .more_wrap{ cursor:pointer} .info_main .more_wrap:after{content:"\e914"; font-family:xeicon!important; border:1px solid #aaa; color:#666; border-radius:2px; opacity:0; transition:.3s} .info_main .more_wrap.conbox_tit.c1.re:after{ border-color:#002654; color:#002654} .info_main .more_wrap.conbox_tit.c5:after{ border-color:#608c33; color:#608c33} .info_main .more_wrap:hover:after{ opacity:1; margin-left:15px} .info_main .conbox_tt{ padding:0 5px} .info_main .conbox_tt .t1{ font-size:.875em; color:#222; font-weight:bold} .info_main .conbox_tt .t2{ font-size:.813em; color:#555; line-height:1.5; margin-top:10px} .info_main .conbox_tt .t3{ font-size:.813em; color:#222; line-height:1.4; margin-top:15px; line-height:-2px} .info_main .tit_box .tbox1{ color:#fff} .info_main .tit_box .tbox1 .t1{ font-family:notokrM, sans-serif; font-size:1.625em; letter-spacing:-2px; padding:10px 0 15px 0} .info_main .tit_box .tbox1 .t2{ font-family:notokrR, sans-serif; font-size:.875em; line-height:1.4} .info_main .tit_box .img{ height:210px; margin:10px 0} .info_main .tit_box .tbox2{ } .info_main .tit_box .tbox2 .t1{ font-size:.813em; font-weight:bold; color:#a3d5ff} .info_main .tit_box .tbox2 .t2{ font-size:.75em; color:#fff; opacity:.8; margin:10px 0 0 0; line-height:1.5} .info_main .tit_box .btn{ margin-top:20px} .info_main .tit_box .btn > a{ display:block; line-height:40px; background:#006fcc; border:2px solid transparent; padding:0 20px; color:#fff; position:relative; box-shadow:2px 2px 4px rgba(0,0,0,.3); transition:.3s} .info_main .tit_box .btn > a .icon{ padding-right:5px} .info_main .tit_box .btn > a .tt{ font-weight:bold; font-size:.875em} .info_main .tit_box .btn > a .arrow{ position:absolute; right:20px; top:0; font-size:.938em} .info_main .tit_box .btn > a:hover{ border-color:rgba(255,255,255,.2)} .info_main .law_wrap{ border-radius:5px; border:1px solid #b9c3cf; overflow:hidden; margin-top:15px; overflow:hidden} .info_main .law_wrap > li{ width:33.33%} .info_main .law_wrap > li *{transition:.3s} .info_main .law_wrap > li > a{ background:#f3f8fb; border-left:none; border-top:none; padding:15px 60px 0 20px; height:85px; position:relative} .info_main .law_wrap > li > a:before{ content:""; position:absolute; width:1px; height:100%; background:#b9c3cf; top:0; right:-1px; z-index:1} .info_main .law_wrap > li > a:after{ content:""; position:absolute; width:100%; height:1px; background:#b9c3cf; bottom:-1px; right:0; z-index:1} .info_main .law_wrap > li > a .tit{ display:block; color:#2f4f74; font-weight:bold; font-size:.875em; padding-bottom:7px;} .info_main .law_wrap > li > a .tt{ display:block; font-size:.75em; line-height:1.4; color:#2f4f74; opacity:0; padding-top:10px} .info_main .law_wrap > li > a .img{ position:absolute; right:5px; bottom:0; width:60px; height:60px; background-image:url(../images/subN/info_law_icon.png); background-repeat:no-repeat} .info_main .law_wrap > li > a:hover{background:#dbe7f1} .info_main .law_wrap > li > a:hover .tt{ opacity:.8; padding-top:0} .info_main .law_wrap > li > a:hover .img{ transform:rotateY(180deg)} .info_main .law_wrap > li.m2 > a .img{ background-position-x:-60px} .info_main .law_wrap > li.m3 > a .img{ background-position-x:-120px} .info_main .law_wrap > li.m4 > a .img{ background-position-x:-180px} .info_main .law_wrap > li.m5 > a .img{ background-position-x:-240px} .info_main .law_wrap > li.m6 > a .img{ background-position-x:-300px} .info_main .slide_wrap{ margin-top:25px} .info_main .slide_wrap .slides{ overflow:hidden} .info_main .slide_wrap .slide_con{ border:1px solid #ccd6de; border-radius:5px; background:#fff; height:250px; padding-bottom:30px; position:relative; margin-top:-5px} .info_main .slide_wrap .slide_con:before{ content:""; position:absolute; width:100%; height:1px; left:0; bottom:30px; background:#ccd6de} /* .info_main .slide_wrap .slide_con .list{ cursor:pointer} .info_main .slide_wrap .slide_con .list .tit{ height:50px; border-bottom:1px solid #ccd6de; font-size:.875em; color:#666; font-weight:bold} .info_main .slide_wrap .slide_con .list .con{ padding:10px 15px; text-align:center} .info_main .slide_wrap .slide_con .list .con .t1{ font-size:.75em; font-weight:bold; color:#999} .info_main .slide_wrap .slide_con .list .con .t2{ font-size:.875em; font-weight:bold; color:#555; letter-spacing:-1px; margin:2px 0 10px 0} .info_main .slide_wrap .slide_con .list .con .img{ height:107px; overflow:hidden} .info_main .slide_wrap .slide_con .list .con .img img{ width:100%; height:100%} .info_main .slide_wrap .slide_con .list:hover .tit{ color:#111} */ .info_main .slide_wrap .slide_con .flex-control-paging{ position:absolute; width:100%; bottom:10px; box-sizing: border-box; padding:0 70px 0 10px; font-size:0; overflow:hidden} .info_main .slide_wrap .slide_con .flex-control-paging > li{ float:left; margin-right:3px} .info_main .slide_wrap .slide_con .flex-control-paging > li > a{ display:block; width:9px; height:9px; border:1px solid #97afc2; border-radius:9px; transition:.3s} .info_main .slide_wrap .slide_con .flex-control-paging > li > a.flex-active{ width:30px; background:#97afc2} .info_main .slide_wrap .slide_con .flex-direction-nav{ position:absolute; right:0; bottom:0; overflow:hidden} .info_main .slide_wrap .slide_con .flex-direction-nav > li{ float:left} .info_main .slide_wrap .slide_con .flex-direction-nav > li > a{ display:block; width:30px; line-height:30px; height:30px; border-left:1px solid #ccd6de; text-align:center; font-size:0; color:#97afc2; transition:.3s} .info_main .slide_wrap .slide_con .flex-direction-nav > li > a:before{ font-size:1.125rem; font-family:xeicon!important} .info_main .slide_wrap .slide_con .flex-direction-nav > li > a.flex-prev:before{content:"\e93c"} .info_main .slide_wrap .slide_con .flex-direction-nav > li > a.flex-next:before{content:"\e93f"} .info_main .slide_wrap .slide_con .flex-direction-nav > li > a:hover{ background:rgba(0,0,0,.1); color:#666} .info_main .link_wrap > li.w1{ width:40%} .info_main .link_wrap > li.w2{ width:30%} .info_main .link_wrap > li *{ transition:.3s} .info_main .link_wrap > li .in{ border:1px solid #ddd; height:120px; margin:0 -1px -1px 0; cursor:pointer; position:relative; overflow:hidden} .info_main .link_wrap > li .in .more{ position:absolute; line-height:25px; left:0; bottom:-25px; width:100%; text-align:center; background:#aaa; color:#fff; font-size:.813em; font-weight:bold} .info_main .link_wrap > li .in:hover{ background:#f7f7f7} .info_main .link_wrap > li .in:hover .conbox_tt{ margin-top:-7px} .info_main .link_wrap > li .in:hover .more{ bottom:0} .info_main .board_list > li{ width:50%} .info_main .board_list > li .in{ border:1px solid #ddd; height:140px; margin:0 -1px -1px 0} .info_main .board_list > li .in .list{ font-size:.813em; padding:0 5px} .info_main .board_list > li .in .list > li > a{ display:block; position:relative; line-height:20px; padding-right:80px; text-overflow:ellipsis; white-space:nowrap; overflow:hidden} .info_main .board_list > li .in .list > li > a .tt{ color:#333} .info_main .board_list > li .in .list > li > a .date{ position:absolute; right:0; top:0; width:80px; text-align:right; color:#999} .info_main .board_list > li .in .list > li > a:hover .tt{ font-weight:bold; color:#111} .info_main .ebook_wrap{ position:relative; padding-right:90px} .info_main .ebook_wrap .img{ position:absolute; width:85px; height:111px; right:-10px; top:-32px; border:1px solid #eee; box-shadow:0 1px 1px rgba(0,0,0,.3); overflow:hidden} .info_main .ebook_wrap .img img{ width:100%; height:100%} .info_main .ebook_wrap .con{ padding:0 0 0 5px} .info_main .ebook_wrap .con .t1{ font-weight:bold; color:#111; font-size:.813em; margin-top:-5px} .info_main .ebook_wrap .con .t2{ color:#666; font-size:.75em; margin:5px 0 10px 0} .info_main .info_main_btn{ display:inline-block; *display:inline; zoom:1; line-height:25px; padding:0 15px; width:70px; border-radius:3px; border:1px solid #aaa; font-weight:bold; font-size:.75em; color:#666; background:#fff; position:relative; transition:.3s} .info_main .info_main_btn .arrow:before{content:"\e93f"; position:absolute; right:10px; top:0; font-size:.875em} .info_main .info_main_btn.c1{ border-color:#98b37e; color:#608c33} .info_main .info_main_btn:hover{ box-shadow:0 1px 3px rgba(0,0,0,.3)} .a_st:hover{ text-decoration:underline} a.a_st_down{ font-weight:bold; color:#666; transition:.3s} a.a_st_down .xi{ margin-left:5px; color:#111; opacity:0; transition:.3s} a.a_st_down .xi:before{content:"\eb7c"; vertical-align:baseline; font-size:.938em} a.a_st_down:hover{ font-weight:bold; color:#111; text-decoration:underline} a.a_st_down:hover .xi{ opacity:1;} .space{ display:inline-block; *display:inline} .space.w1{ width:20px} .sub_file_wrap{ border-bottom:1px solid #ddd; padding:10px; line-height:20px} .sub_file_wrap > *{ display:inline-block; *display:inline; zoom:1;} .sub_file_wrap .tit{ font-weight:bold; font-size:.813em; color:#333} .sub_file_wrap .list > li > a{ margin-right:20px; font-size:.813em; color:#666} .sub_file_wrap .list > li > a:hover{ text-decoration:underline} .step_st{ font-size:0; text-align:center} .step_st .va_wrap{ font-size:0} .step_st .va_wrap .va_tt{ font-size:16px; font-size:1rem} .step_st .in_box{ font-size:16px; font-size:1rem} .step_st .line_in{ padding-left:0 !important; padding-right:0 !important;} .step_st .line_in .va_tt{ width:100%;} .step_st > li{ display:inline-block; *display:inline; zoom:1; font-size:16px; font-size:1rem; vertical-align:middle; position:relative} .step_st.sec7 > li{ width:14.2857%} .step_st.sec5 > li{ width:20%} .step_st.sec4 > li{ width:25%} .step_st.sec3 > li{ width:33.33%} .step_st.sec2 > li{ width:50%} .step_st > li.w100{ width:100%} .step_st > li.w66 { width:66.67%} .step_st > li.w60 { width:60%} .step_st > li.w57 { width:57.1428%} .step_st > li.w1_1{ width:15%} .step_st > li.w1_2{ width:19%} .step_st > li.w1_3{ width:28%} .step_st > li.w1_4{ width:18.34%} .step_st > li.w2_1{ width:10%} .step_st > li.w2_2{ width:15%} .step_st > li.w3_1{ width:30%} .step_st > li.w3_2{ width:70%} .step_st > li.w3_3{ width:35%} .step_st > li.w4_1{ width:8%} .step_st > li.w4_2{ width:25.34%} .step_st > li.w4_3{ width:92%} .step_st > li.w4_4{ width:15%} .step_st > li.w4_5{ width:51.66%} .step_st > li.w4_6{ width:36%} .step_st > li.w4_7{ width:30.66%} .step_st > li.w4_8{ width:47%} .step_st > li.w_auto{ width:auto} .step_st{ margin:0 0 -30px 0} .step_st.st1{ margin:0 0 0 0} .step_st > li .in{ display:block; margin:30px 20px 30px 20px; position:relative; text-align:center; padding:0 10px} .step_st > li .in:first-child{ margin-top:0} .step_st > li .in .bg{ position:absolute; left:0; top:0; width:100%; height:100%; box-sizing:border-box; border:1px solid #bbb; background:#fff; border-radius:4px; box-shadow:1px 1px 3px rgba(0,0,0,.1); overflow:hidden;} .step_st > li .in .bg.st2{} .step_st > li .in .bg.st2:before{content:''; display:block; position:absolute; left:0; top:0; width:100%; height:50%; background:#f1f1f1;} .step_st > li .in .va_wrap{ position:relative; height:80px} .step_st > li .in .t1{ font-weight:bold; color:#333; font-size:.813em} .step_st > li .in .t2{ color:#666; font-size:.75em; margin:5px 0} .step_st > li .in .t3{ font-weight:bold; color:#005aa6; font-size:.875em} .step_st > li .in .t4{ font-weight:bold; color:#fff;} .step_st > li .in .arrow{ position:absolute; width:40px; line-height:30px; left:-40px; top:50%; margin-top:-15px; text-align:center} .step_st > li .in .arrow:before{content:"\e90b"; font-family:xeicon!important; font-size:2em; color:#ccc} .step_st > li .in .arrow.right{ left:auto; right:-40px} .step_st > li .in .arrow.vt:before{content:"\e90a"; font-size:.938em} .step_st > li .in .arrow.left:before{ content:"\e908";} .step_st > li .in .arrow.top:before{content:"\e909";} .step_st > li .in .arrow.bottom:before{content:"\e90a";} .step_st > li .in .arrow .tt{ position:absolute; width:40px; line-height:1.1; left:0; bottom:50%; margin-bottom:10px; text-align:center; font-size:.688em; color:#777;} .step_st > li .in .arrow.vt{ left:0; width:100%; top:0; margin-top:-30px} .step_st > li .in .arrow.vb{ left:0; width:100%; top:auto; bottom:0; margin-bottom:-30px} .step_st > li .in .arrow.vt .tt, .step_st > li .in .arrow.vb .tt{ width:50%; line-height:30px; bottom:0; margin-bottom:0;} .step_st > li .in .arrow.vt .tt{ left:50%; margin-left:15px; text-align:left} .step_st > li .in .arrow.vb .tt{ left:auto; right:50%; margin-right:15px; text-align:right} .step_st > li .in .arrow.c1:before{ color:#f34b6b;} .step_st > li .in .arrow.c2:before{ color:#57b907;} .step_st > li .in .line{ position:relative; display:inline-block; vertical-align:top; background:#ccc; width:100%; height:2px; font-size:16px; font-size:1rem;} .step_st > li .in .line.top, .step_st > li .in .line.bottom{ width:2px; height:100%;} .step_st > li .in .line.icon:before{ font-family:xeicon!important; color:#ccc; position:absolute;} .step_st > li .in .line.icon.right:before { content:"\e93e"; margin-top:-.6em; top:50%; right:-5px;} .step_st > li .in .line.icon.left:before { content:"\e93b"; margin-top:-.6em; top:50%; left:-5px;} .step_st > li .in .line.icon.top:before { content:"\e944"; margin-left:-.5em; left:50%; top:-6px;} .step_st > li .in .line.icon.bottom:before{ content:"\e941"; margin-left:-.5em; left:50%; bottom:-6px;} .step_st > li .in .line .tt{ position:absolute; left:0; width:100%; text-align:center; font-size:.688em; color:#777;} .step_st > li .in .line.right, .step_st > li .in .line.left { margin:10px 0;} .step_st > li .in .line.top, .step_st > li .in .line.bottom { margin:0 10px;} .step_st > li .in .line.right .tt { bottom:50%; margin-bottom:10px;} .step_st > li .in .line.left .tt { top:50%; margin-top:10px;} .step_st > li .in .line.top .tt { top:50%; margin-left:1em; width:auto;} .step_st > li .in .line.bottom .tt{ top:50%; margin-right:1em; width:auto; left:auto; right:0; text-align:right;} .step_st > li .in .line .tt.vt { top:auto; bottom:50%; margin-top:auto; margin-bottom:10px;} .step_st > li .in .line.pos{ position:absolute;} .step_st > li .in .line.pos.vl{ width:40px; left:-40px; top:50%;} .step_st > li .in .line.pos.vt{ left:50%; bottom:100%; margin:0 0 0 0;} .step_st > li .in .line.pos.vb{ left:50%; top:100%; margin:0 0 0 0;} .step_st > li .in .line.mg0{ margin:0;} .step_st > li .in .line.h1{ height:110px;} .step_st > li .in .line.h2{ height:136px;} .step_st > li .in .line.h3{ height:350px;} .step_st > li .in.h1 .va_wrap{ height:130px} .step_st > li .in.h2 .va_wrap{ height:70px} .step_st > li .in.h3 .va_wrap{ height:170px} .step_st > li .in.h4 .va_wrap{ height:50px} .step_st > li .in.h5 .va_wrap{ height:60px} .step_st > li .in.h6 .va_wrap{ height:30px} .step_st > li .in.h7 .va_wrap{ height:210px} .step_st > li .in.h8 .va_wrap{ height:100px} .step_st > li .in.h9 .va_wrap{ height:440px} .step_st > li .in.h10 .va_wrap{ height:370px} .step_st > li .in.h11 .va_wrap{ height:290px} .step_st > li .in.h12 .va_wrap{ height:320px} .step_st > li .in.h13 .va_wrap{ height:80px} .step_st > li .in.h14 .va_wrap{ height:106px} .step_st > li .in.hw .va_wrap{ height:100px; width:100px;} .step_st > li .in.hauto .va_wrap{ height:auto; padding:15px 0;} .step_st > li .in.w1{ width:30%;} .step_st > li .in.st1 .bg{ border-style:dashed} .step_st > li .in.st2{ padding:10px} .step_st > li .in.st2 .bg{ border-radius:100%} .step_st > li .in.st3{ padding:15px} .step_st > li .in.st4 .bg{ border-width:3px} .step_st > li .in.st5 .bg{ border-radius:50px; background:#11b0e9; border:none; box-shadow:none;} .step_st > li .in.c1 .bg{ background:#c7edf7; border-color:#acd8e3} .step_st > li .in.c2 .bg{ background:#f5f5f5} .step_st > li .in.c3 .bg{ background:#f47920; border-color:#f47920} .step_st > li .in.c4 .bg{ background:#ec4747; border-color:#ec4747} .step_st > li .in.c5 .bg{ background:#b81818; border-color:#b81818} .step_st > li .in.c6 .bg{ background:#57b907; border-color:#57b907} .step_st > li .in.cw .bg{ background:#fff;} .step_st > li .in.cg .bg{ border:none; border-radius:0 0 8px 8px; box-shadow:1px 1px 4px rgba(0,0,0,.3); background: rgb(241,241,241); /* Old browsers */ background: -moz-linear-gradient(left, rgba(241,241,241,1) 0%, rgba(255,255,255,1) 40%, rgba(255,255,255,1) 40%); /* FF3.6-15 */ background: -webkit-linear-gradient(left, rgba(241,241,241,1) 0%,rgba(255,255,255,1) 40%,rgba(255,255,255,1) 40%); /* Chrome10-25,Safari5.1-6 */ background: linear-gradient(to right, rgba(241,241,241,1) 0%,rgba(255,255,255,1) 40%,rgba(255,255,255,1) 40%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f1f1f1', endColorstr='#ffffff',GradientType=1 ); /* IE6-9 */ } .step_st > li .in.cg .bg:before{ content:""; position:absolute; top:0; left:0; width:100%; height:1px; background:#11b0e9;} .step_st > li .in.span2 .bg{ width:calc(200% + 40px)} .step_st > li .in.span2 .va_tt{ position:relative; width:calc(200% + 60px)} .step_st > li .in.span2 .arrow.right{ right:calc(-200% + 35px)} .step_st > li .in.mgL{ margin-left:0;} .step_st > li .in.mgR{ margin-right:0;} .step_st > li .in.mgT{ margin-top:10px;} .step_st > li .in.mgB{ margin-bottom:10px;} .step_st > li .in.mg0{ margin-top:0; margin-bottom:0} .step_st > li .in.mg1{ margin-top:10px; margin-bottom:10px} .step_st > li .in.mg2{ margin:0;} .step_st > li .in.pd0{ padding:0;} .step_st > li .in .in_box{ position:relative; border:1px solid #ddd;} .step_st > li .in .in_box + .in_box{ margin-top:5px;} .step_st > li .in .in_box > dt{ padding:8px 10px; background:#f5f5f5; border-bottom:1px solid #ddd;} .step_st > li .in .in_box > dt + dt{ background:#fff;} .step_st > li .in .in_box > dt:last-child{ border-bottom:none;} .step_st > li .in .in_box > dd{ padding:10px 10px;} .step_st > li .in .in_box.st1{ text-align:left; border-color:#d1dfe3;} .step_st > li .in .in_box.st1 > dt{ padding:12px 18px; background:#f5fbfc; border-bottom-style:dashed; border-bottom-color:#d1dfe3;} .img_tb_wrap{ overflow:hidden; margin-top:20px} .img_tb_wrap .left{ float:left; width:70%} .img_tb_wrap .right{ float:right; width:28%; margin-top:28px} .chart_group{ margin:0 -20px -20px 0} .chart_group > li{ width:50%} .chart_group > li .in{ margin:0 20px 20px 0} /**/ .error_wrap{ position:fixed; left:0; top:0; width:100%; height:100%} .error_wrap .error{ width:700px; text-align:left; padding-bottom:80px} .error_wrap .error .error_tit{ border-bottom:1px solid #ddd} .error_wrap .error .error_tit .xi{ font-size:7em; color:#005aa6; vertical-align:middle} .error_wrap .error .error_tit .t1{ font-size:5em; color:#bbb; vertical-align:middle; font-family: Verdana, Arial, Helvetica, sans-serif; letter-spacing:-2px} .error_wrap .error .error_con{ position:relative; margin:30px 20px 0 50px; padding:20px 0 20px 40px} .error_wrap .error .error_con:before{ content:""; width:10px; height:100%; position:absolute; left:0; top:0; background:#005aa6; border-radius:10px} .error_wrap .error .error_con .t1{ font-size:1.75em; color:#111; font-weight:bold; letter-spacing:-2px; font-family:notokrB, sans-serif} .error_wrap .error .error_con .t2{ font-size:1.25em; color:#999; letter-spacing:-1px; margin-top:20px; font-family:notokrR, sans-serif} .error_wrap .error .error_btn{ text-align:right; padding-top:50px} .error_wrap .error .error_btn .btn{ display:inline-block; *display:inline; zoom:1; padding:0 30px 0 30px; background:#005aa6; color:#fff; font-weight:bold; font-size:.938em; line-height:45px} .error_wrap .error .error_btn .btn .xi{ font-size:1.5em; font-weight:normal; padding-right:3px} .help_ex_area{ display:inline-block; *display:inline; zoom:1; vertical-align:middle; position:relative;} .help_ex_area .help_icon{ position:relative; z-index:0; display:inline-block; *display:inline; zoom:1; border:1px solid #bbb; border-radius:3px; background:#fff; text-align:center; min-width:45px; padding:3px 5px 5px 5px; color:#333; font-weight:normal; cursor:pointer; transition:all 0.2s;} .help_ex_area .in_ex{ display:none; position:absolute; z-index:1001; top:24px; width:340px; padding:10px 20px; border:1px solid #999; border-radius:3px; background:#fff; text-align:left;} .help_ex_area .in_ex.ps_r{ right:0;} .help_ex_area .in_ex.ps_l{ left:0;} .help_ex_area .in_ex.ps_c{ left:50%; margin-left:-170px;} .help_ex_area:hover .help_icon{ border:1px solid #555; background:#777; color:#fff;} .help_ex_area:hover .in_ex{ display:block;} .help_ex_area .in_ex .in_txt1{} .help_ex_area .in_ex .in_txt1 dt{ margin-bottom:6px; color:#333; font-weight:600;} .help_ex_area .in_ex .in_txt1 dd{ padding:2px 0; font-size:12px; font-weight:normal; line-height:1.3;} /*도움말 관련 css */ .tbl_wrap .state{ display:inline-block; *display:inline; zoom:1; vertical-align:middle; text-align:center; line-height:1; transition:all 0.2s;} .tbl_wrap .state.s1{ min-width:45px; padding:2px 5px 4px 5px; border-radius:3px; font-size:12px;} .tbl_wrap .state.c1{ background-color:#ffffff; border:1px solid #5d9eee; color:#498ce0;}/*파랑*/ .tbl_wrap .state.c2{ background-color:#ffffff; border:1px solid #efb65c; color:#e89a1e;}/*오렌지*/ .tbl_wrap .state.c3{ background-color:#ffffff; border:1px solid #75b100; color:#619201;}/*연두*/ .tbl_wrap .state.c4{ background-color:#ffffff; border:1px solid #ea8fc7; color:#ed49ae;}/*분홍*/ .tbl_wrap .state.c5{ background-color:#ffffff; border:1px solid #f06565; color:#e92c2c;}/*빨강*/ .tbl_wrap .state.c6{ background-color:#ffffff; border:1px solid #999999; color:#444444;}/*회색*/ .tbl_wrap .state.c7{ background-color:#ffffff; border:1px solid #bbbbbb; color:#222222;}/*연회색*/ .tbl_wrap a.state.c6:hover{ background-color:#555555; border:1px solid #333333; color:#ffffff;} .tbl_wrap .icon{ display:inline-block; *display:inline; zoom:1; vertical-align:middle; background-repeat:no-repeat;} .tbl_wrap .icon.check{ width:18px; height:17px; background-image:url(../images/sub/icon_check.png);} .tbl_wrap .icon.break{ width:19px; height:19px; background-image:url(../images/sub/icon_break.png);} .tbl_wrap .icon.pdf { width:16px; height:16px; background-image:url(../images/sub/form_icon_pdf.gif);} .tbl_wrap .icon.ppt { width:16px; height:16px; background-image:url(../images/sub/form_icon_ppt.gif);} .tbl_wrap .icon.excel{ width:16px; height:16px; background-image:url(../images/sub/form_icon_excel.gif);} .tbl_wrap .icon.word { width:16px; height:16px; background-image:url(../images/sub/form_icon_word.gif);} .tbl_wrap .icon.han { width:16px; height:16px; background-image:url(../images/sub/form_icon_han.gif);} .tbl_wrap .icon.hun { width:16px; height:16px; background-image:url(../images/sub/form_icon_hun.gif);} .tbl_wrap .icon.txt { width:16px; height:16px; background-image:url(../images/sub/form_icon_txt.gif);} .tbl_wrap .icon.jpg { width:15px; height:16px; background-image:url(../images/sub/form_icon_jpg.gif);} .tbl_wrap .icon.gif { width:15px; height:16px; background-image:url(../images/sub/form_icon_gif.gif);} .tbl_wrap .icon.zip { width:16px; height:16px; background-image:url(../images/sub/form_icon_zip.gif);} .tbl_wrap .icon.doc { width:16px; height:16px; background-image:url(../images/sub/form_icon_doc.gif);} .tbl_wrap .icon.etc { width:16px; height:16px; background-image:url(../images/sub/form_icon_etc.gif);} .tbl_wrap .icon.blue { width:10px; height:11px; background-image:url(../images/sub/doc_icon_blue.png);} .tbl_wrap .icon.red { width:10px; height:11px; background-image:url(../images/sub/doc_icon_red.png);} .tbl_wrap .icon.close{ width:14px; height:14px; background-image:url(../images/sub/icon_close.png);} .tbl_wrap .icon.open { width:18px; height:14px; background-image:url(../images/sub/icon_open.png);} .tbl_wrap .icon.view { width:16px; height:16px; background-image:url(../images/sub/icon_view.png);} .tbl_wrap .icon.memo_open { width:15px; height:16px; background-image:url(../images/sub/icon_memo_open.png);} .tbl_wrap .icon.memo_close { width:16px; height:12px; background-image:url(../images/sub/icon_memo_close.png);} .tbl_wrap .icon.person { width:18px; height:18px; background-image:url(../images/sub/icon_person.png);} .tbl_wrap .icon.arrow { width:6px; height:10px; background-image:url(../images/sub/icon_arrow_bl.png);} .tbl_wrap .icon.delx { width:8px; height:7px; background-image:url(../images/sub/icon_delx.png);} .tbl_wrap a.icon.close{ cursor:default;} .tbl_wrap .help_ex_area{ display:inline-block; *display:inline; zoom:1; vertical-align:middle; position:relative;} .tbl_wrap .help_ex_area .help_icon{ position:relative; z-index:0; display:inline-block; *display:inline; zoom:1; border:1px solid #bbb; border-radius:3px; background:#fff; text-align:center; min-width:45px; padding:3px 5px 5px 5px; color:#333; font-weight:normal; cursor:pointer; transition:all 0.2s;} .tbl_wrap .help_ex_area .in_ex{ display:none; position:absolute; z-index:1001; top:24px; width:340px; padding:10px 20px; border:1px solid #999; border-radius:3px; background:#fff; text-align:left;} .tbl_wrap .help_ex_area .in_ex.ps_r{ right:0;} .tbl_wrap .help_ex_area .in_ex.ps_l{ left:0;} .tbl_wrap .help_ex_area .in_ex.ps_c{ left:50%; margin-left:-170px;} .tbl_wrap .help_ex_area:hover .help_icon{ border:1px solid #555; background:#777; color:#fff;} .tbl_wrap .help_ex_area:hover .in_ex{ display:block;} .tbl_wrap .help_ex_area .in_ex .in_txt1{} .tbl_wrap .help_ex_area .in_ex .in_txt1 dt{ margin-bottom:6px; color:#333; font-weight:600;} .tbl_wrap .help_ex_area .in_ex .in_txt1 dd{ padding:2px 0; font-size:12px; font-weight:normal; line-height:1.3;} .tbl_wrap .file_view_area{ display:inline-block; *display:inline; zoom:1; vertical-align:middle; position:relative;} .tbl_wrap .file_view_area .icon_bubble{ position:absolute; width:28px; height:10px; top:-10px; left:42%; background:url(../images/sub/icon_bubble2.png) no-repeat;} .tbl_wrap .file_view_area .icon{ cursor:pointer;} .tbl_wrap .file_view_area .in_file{ position:absolute; z-index:1001; top:16px; width:250px; padding:10px 20px; border:1px solid #bbb; border-radius:3px; background:#fff; box-shadow:1px 1px 1px rgba(0,0,0,0.1); text-align:left; display:none;} .tbl_wrap .file_view_area .in_file.ps_r{ right:0;} .tbl_wrap .file_view_area .in_file.ps_l{ left:0;} .tbl_wrap .file_view_area .in_file.ps_c{ left:50%; margin-left:-168px;} .tbl_wrap .file_view_area:hover .in_file{ display:block;} .tbl_wrap .file_view_area .in_file .in_list{} .tbl_wrap .file_view_area .in_file .in_list li{ padding:2px 0 2px 10px;} .tbl_wrap .file_view_area .in_file .in_list li a{ font-size:12px; line-height:1.3; position:relative;} .tbl_wrap .file_view_area .in_file .in_list li a:before{ content:""; position:absolute; left:-10px; top:8px; width:3px; height:2px; background:#555;} .tbl_wrap .file_view_area .in_file .in_list li a:hover{ text-decoration:underline;} .tbl_wrap .cell_1{ display:none;} .tbl_wrap .cell_2{ display:none;} .tbl_wrap .cell_3{ display:none;} .sub_img_box{ background:url(../images/subN/3_1_1_con1.jpg?v=1) no-repeat left 70%; background-size:cover; height:150px; padding:0 2em; text-align:left} .sub_img_box .t1{ font-size:1.625em; font-family:notokrB, sans-serif; color:#222; letter-spacing:-2px; word-spacing:2px} .sub_img_box .t2{ font-size:.875em; margin-top:.75em; line-height:1.4} .sub_img_box .c1{ color:#005aa6} .sub_img_box .c2{ color:#111} .soon_wrap{ background:#fff; margin-top:-5em; position:relative; padding:2em 0 5em 0} .soon_wrap .icon_wrap{ width:11em; height:11em; padding:3px; margin:0 auto; position:relative} .soon_wrap .icon_wrap .bg{ position:absolute; left:0; top:0; width:100%; height:100%; background: linear-gradient(-45deg, #00b3e6 0%, #c4e351 50%, #00b3e6 100%); border-radius:100%} .soon_wrap .icon_wrap .in{ position:relative; width:100%; height:100%; background:url(../images/inc/soon.png) no-repeat center center #fff; border-radius:100%} .soon_wrap .tit{ font-size:2.5em; color:#005aa6; font-family:notokrB, sans-serif; text-align:center; margin:.5em 0 .75em 0; letter-spacing:-2px; word-spacing:3px} .soon_wrap .con{ background:#f7f7f7; padding:3em 2em; padding-bottom:4em; text-align:center} .soon_wrap .con .t1{ font-family:notokrR, sans-serif; color:#111; font-size:2em; letter-spacing:-2px; word-spacing:3px} .soon_wrap .con .t1 .strong{ font-family:notokrB, sans-serif} .soon_wrap .con .t2{ color:#333; margin-top:1.5em; line-height:1.6; font-family:notokrR, sans-serif} @media print{ #header .top_banner, #header .home_wrap, #header .menu_wrap, #header .gnb_menu, #contents .content_nav, #contents .sub_con .lnb_area, .b_slide2, #footer{ display:none} #header{ border-bottom:2px solid #0065ab; overflow:hidden; text-align:left; padding-bottom:20px; box-shadow:none} #header .logo{ position:static; width:100%} #contents .sub_con .con_area{ float:none} } /*201217 added-'sub_member/join.asp'*/ .top_box{display:flex; justify-content:space-between;} .top_box .ling_wrap{width:auto;} .page_member_join .login_wrap2{border-bottom:0;} .page_member_join .login_wrap2 .link_wrap{border-top:0;} .page_member_join .login_wrap2 .tit_wrap .t1{color:#111; margin-bottom:0; position:relative;} .page_member_join .login_wrap2 .tit_wrap .sm_t1:before{content:''; display:block; width:44px; height:4px; background:#005aa6; position:absolute; left:50%; bottom:-20px; transform:translateX(-50%);} .login_wrap2 .imgbox_st.sec4 > li{width:33.33%;} .login_wrap2.st1 .top_box .login_box_wrap{width:31 0px; padding:0;} .login_wrap2.st1 .top_box .login_box_wrap .list.w1 > li{width:100%;} .login_wrap2 .top_box .link_wrap{display:flex; flex-direction:column; justify-content:space-between; width:54%; padding-bottom:.5rem;} .login_wrap2 .top_box .link_wrap > li.w1{width:100%; margin-top:45px;} .login_wrap2 .top_box .link_wrap > li{width:100%;} .login_wrap2 .top_box .link_wrap > li .in{ padding-top:0; padding-bottom:15px; padding-left:20px;} .login_wrap2 .top_box .link_wrap > li .in:before{height:1px; width:100%; left:0; top:-38%;} .login_wrap2 .top_box .link_wrap > li .in .icon{ top:0} .login_wrap2 .top_box .link_wrap > li:nth-of-type(2) .tt:nth-of-type(2){display:inline-block;} .login_wrap2 .top_box .link_wrap > li:nth-of-type(2) .in .link{margin-top:-4px; margin-left:20px;} .login_wrap2 .top_box .link_wrap > li .link_to_join_wrap{display:block; width:100%; border-radius:4px; background:#005aa6; color:#fff; font-weight:bold; font-size:1.375em; text-align:center; padding:.25em; cursor:pointer; box-sizing:border-box;} .login_wrap2 .top_box .sub_tbox2{padding:0;} .login_wrap2 .top_box .sub_tbox2 .tt_wrap.icon{padding:0;} .login_wrap2 .top_box .sub_tbox2 .tt_wrap.icon:before{display:none;} .login_wrap2 .top_box .sub_tbox2 .tt_wrap2{border:none; padding:0;} .login_wrap2 .top_box .sub_tbox2 .tt_wrap2 .imgbox_st.step > li:last-of-type .in{margin-right:0;} .login_wrap2 .top_box .sub_tbox2 .tt_wrap2 .imgbox_st.step > li:nth-of-type(3) .in .img .icon{background:#005aa6;} .login_wrap2 .top_box .sub_tbox2 .tt_wrap2 .imgbox_st > li:nth-of-type(3) .in .img .icon .xi{color:#fff;} .top_box{margin-top:2em;} .top_box #main_visual{position:static; z-index:auto; height:auto; width:40%;} .top_box #main_visual .box1{margin-top:1.375em; width:auto;} .top_box #main_visual .main_system{position:static; z-index:auto; left:auto; bottom:auto;} .top_box #main_visual .main_system .tit{display:block;font-weight:bold;color: #005aa6;font-size:.875em;margin-bottom:7px;} .top_box #main_visual .main_system .tit .icon{width:17px; line-height:17px; border-radius:100%; text-align:center; color:#fff; background:#005aa6; font-size:.875em} .top_box #main_visual .main_system .tit .icon:before{content:"\e93f";} .top_box #main_visual .main_system .tt{display:block; font-size:.813em; color:#333; line-height:1.5; padding-left:0;} .top_box #main_visual .main_system .list{ padding-right:4px; display:flex; justify-content:space-between; flex-direction:column; margin-top:1.5rem;} .top_box #main_visual .main_system .list > li{ width:100%; margin-bottom:1em; position:relative;} .top_box #main_visual .main_system .list > li:last-of-type{margin-bottom:0;} .top_box #main_visual .main_system .list > li > a{ width:100%; border-radius:5px;} .top_box #main_visual .main_system .list > li > a:hover{border-radius:0 0 5px 5px;} .login_wrap2 .top_box .sub_tbox2 .tt_wrap2 .imgbox_st.step > li:nth-of-type(2) .in .img .icon{background:#005aa6;} .login_wrap2 .top_box .sub_tbox2 .tt_wrap2 .imgbox_st.step > li:nth-of-type(3) .in .img .icon{background: linear-gradient(to right, rgba(241,241,241,1) 0%,rgba(255,255,255,1) 40%,rgba(255,255,255,1) 40%);} .login_wrap2 .top_box .sub_tbox2 .tt_wrap2 .imgbox_st > li:nth-of-type(2) .in .img .icon .xi{color:#fff;} .login_wrap2 .top_box .sub_tbox2 .tt_wrap2 .imgbox_st > li:nth-of-type(3) .in .img .icon .xi{color:#aaa;} .down_btn_list_wrap ul{display:flex; justify-content:flex-start; width:92%; margin:0 auto;} .down_btn_list_wrap ul li{font-size:.813em; cursor:pointer; transition:.3s; width:32%; margin-right:5px;} .down_btn{border-radius:4px; text-align:center; line-height:28px; display:inline-block; height:30px; width:100%; transition:.3s; cursor:pointer;} .down_btn.st1{background:#fff; color:#111; border:1px solid #111; box-sizing:border-box;} .down_btn.st1:hover{background:#ddd;} .down_btn.st2{background:#11b0e9; color:#fff; position:absolute; width:32%; right:150px; top:-6px;} .down_btn.st2:hover{background:#11b0e9;} .login_wrap2 #main_visual .main_system .list > li > a{height:70px;} .login_wrap2 #main_visual .main_system .list > li > a .con{padding:7px 0 0 55px;} .login_wrap2 #main_visual .main_system .list > li > a .con .t2{color:#333} .join_btn{position:absolute; background:#3d90d7; color:#fff; padding:.375rem .875rem; border-radius:4px; right:4px; top:37px; cursor:pointer; transition:.3s; font-size:.813em;} .join_btn:hover{background:#175182;} .txt_point{color:; vertical-align:baseline; font-weight:bold;} .login_wrap2 .imgbox_st.step > li .in .img .icon{width:60px; height:60px;} .login_wrap2 .imgbox_st > li .in .img .icon .xi{color:#888;} .page_member_join .login_wrap2 .link_wrap > li .in .icon{left:0px;} .page_member_join .login_wrap2 .top_box .link_wrap > li .in .icon{top:0;} .login_wrap2 .top_box .sub_tbox2 .tt_wrap2 .imgbox_st.step > li:nth-of-type(1) .in .img .icon{background:#e5e5e5;} .login_wrap2 .top_box .sub_tbox2 .tt_wrap2 .imgbox_st.step > li:nth-of-type(2) .in .img .icon{background:#2a7dc4;} .login_wrap2 .top_box .sub_tbox2 .tt_wrap2 .imgbox_st.step > li:nth-of-type(3) .in .img .icon{background:#e5e5e5;} .reply_status{display:flex; width:80px; height:30px; color:#fff; border-radius:15px; justify-content:center; align-items:center; margin:0 auto;} .reply_status.c1{background:#11b0e9;} .reply_status.c2{background:#ccc;} .app_pw{} .app_pw .btn_area{margin-top:20px; display:flex;} .app_pw .btn_area input{margin-right:10px;}