@charset "utf-8";

:root{--color:#14787C !important; --color02:#2AA971 !important; --point:#07ad88; --point02:#635ED0; --point03:#3DA189; --gra:linear-gradient(87.35deg, #4CB731 -1.06%, #31B76E 12.49%, #14787C 91.87%); --graV:linear-gradient(180deg, #14787C 0%, #44B742 100%); --grabg:linear-gradient(125deg, rgba(60, 160, 136, 0.16) 0%, rgba(222, 232, 166, 0.16) 100%); --wrap:1400px}
html, body{font-family:'SCDream'; overflow-x:hidden}
.wrap{margin:auto; width:90%; max-width:var(--wrap);}

h1{font-weight:500}
h1 a{display:flex; align-items:center; font-size:2rem; letter-spacing:-0.14rem; }
h1 a:before{display:block; content:''; width:50px; height:50px; background:url(/open_content/council/img/inc/logo.png) no-repeat left -5px center/cover}
h1 a span{font-size:2.6rem; margin-left:.5rem;}

header{height:16rem}
header #gnb{border-bottom:1px solid #E9E9E9;}
header #gnb .wrap:After{display:block; content:''; clear:both;}
header #gnb .gnbL,
header #gnb .gnbR{display:flex; float:left}
header #gnb .gnbL>li,
header #gnb .gnbR>li{position:relative; padding:1.7rem 2rem 1.8rem}
header #gnb .gnbL>li:nth-of-type(1),
header #gnb .gnbR>li:nth-of-type(1){padding-left:0px; font-weight:600; }
header #gnb .gnbL>li+li:before,
header #gnb .gnbR>li+li:before{display:block; content:''; position:absolute; left:0px; top:50%; margin-top:-.5rem; width:1px; height:1rem; background:#9D9D9D;}
header #gnb .gnbL>li:last-child a{color:var(--point);}
header #gnb .gnbL a{color:#818181}
header #gnb .gnb_member>a{position:relative; padding-right:1.8rem}
header #gnb .gnb_member>a:after{display:block; content:''; position:absolute; right:0px; top:50%; margin-top:-.5rem; width:0px; height:0px; border:0rem solid transparent; border-width:.9rem .5rem; border-top-color:#9D9D9D}
header #gnb .gnb_member div{display:none;}
header #gnb .gnb_member ul{display:flex; flex-wrap:wrap; font-size:0px; position:absolute; top:5.8rem; left:0px; width:100vw; max-width:44rem; background:var(--color02); z-index:900; border-radius:0px 1rem 1rem 1rem; overflow:hidden; box-shadow: 0px 5px 10px 0px rgba(0,0,0,.5)}
header #gnb .gnb_member ul>li{position:relative; width:25%; }
header #gnb .gnb_member ul>li>a{display:flex; flex-direction:column; align-items:center; justify-content:center; min-height:4.7rem; padding:.5rem; line-height:1.2; color:#fff; border-left:1px solid rgba(0,0,0,.2); border-bottom:1px solid rgba(0,0,0,.2)}
header #gnb .gnb_member ul>li>a span{font-size:1.2rem; }
header #gnb .gnb_member ul>li>a:hover{background:var(--color); border-color:var(--color); }
header #gnb .gnb_member.tgl{background:var(--color02);}
header #gnb .gnb_member.tgl>a{color:#fff;}
header #gnb .gnb_member.tgl>a:after{top:0rem; margin-top:-0.3rem; border-top-color:#fff; transform:rotate(-180deg)}
header #gnb .gnb_member.tgl+li:before{display:none;}
header #gnb .gnb_member.tgl div{display:block;}
header #gnb .gnbR{float:right; }
header #gnb .gnbR>li:last-child{margin-right:0px; padding-right:0px;}
header #gnb .gnbR>li>a{position:relative; font-weight:500}
header #gnb .gnbR>li>a:before{display:inline-block; content:''; vertical-align: middle; position: relative; margin:-.3rem 2px 0px 0px; width:2rem; height:2rem; background-position:left center; background-repeat:no-repeat; background-size:cover}
header #gnb .gnbR>li.gnb_login>a:before{background-image:url(/open_content/council/img/inc/ic_login.png);}
header #gnb .gnbR>li.gnb_logout>a:before{background-image:url(/open_content/council/img/inc/ic_logout.png);}
/* header #gnb .gnbR>li.gnb_mypage>a:before{padding-left:0px} */
header #gnb .gnbR>li.gnb_mypage>a:before{display: none;}

header>.wrap{display:flex; gap:1rem; align-items:center; height:10rem}
header nav{flex-grow:1; z-index:890}
header nav>ul{display:flex; justify-content:space-around; margin:auto; padding-left: 4%; max-width:950px; /*max-width:735px;*/}
header nav ul.menu{display:flex;}
header nav ul.menu>li{font-size:2.1rem; }
header nav ul.menu>li>a{display:block; position:relative; padding:3.3rem 0px; font-weight:500;}
header nav ul.menu>li.on>a{color:#3DA189}
header nav ul.menu>li>a:AFter{opacity:0; display:block; content:''; position:absolute; left:25%; bottom:0px; width:50%; height:.6rem; background:var(--gra); transition:all ease .2s}
header nav ul.menu>li.on>a:AFter{opacity:1; left:-3%; width:110%; }
header nav .submenu{opacity:0; position:absolute; left:0px; top:16rem; width:100%; height:0px; overflow:hidden; background:#fff;  z-index:-2; border-top:1px solid #eee; box-shadow:0px 20px 30px rgba(0,0,0,.05); transition:opacity ease .3s, top ease .3s}
header nav .submenu .wrap{display:flex; min-height:20rem; }
header nav .submenu .wrap>p{position:relative; flex-basis:20%; padding-top:4.3rem}
header nav .submenu .wrap>p:before{display:block; content:''; position:absolute; width:100vw; right:0px; top:0px; bottom:0px; background:url(/open_content/council/img/inc/bg_mark.png) no-repeat right 14% bottom -15rem, url(/open_content/council/img/inc/nav_bg.png) no-repeat right top, #F2FAF6; border-top-right-radius:100px}
header nav .submenu .wrap>p span{position:relative; font-weight:600; font-size:3rem; background:linear-gradient(85deg, #22AE8D 0%, #2794AC 100%); background-clip: text; -webkit-background-clip: text; -webkit-text-fill-color:transparent; z-index:1;}
header nav .submenu .wrap>ul{flex-grow:1; padding:4rem 4%; padding-right:0px; font-size:0px}
header nav .submenu .wrap>ul>li{display:inline-block; margin-bottom:2rem; margin-right:3%; width:22.7%; vertical-align:top; }
header nav .submenu .wrap>ul>li:nth-child(4n){margin-right:0px;}
/* header nav .submenu .wrap>ul{flex-grow:1; padding:2rem; display:flex; flex-wrap:wrap}
header nav .submenu .wrap>ul>li{flex-basis:22%} */
header nav .submenu .wrap>ul>li>a{display:block; position:relative; padding:1rem 2rem; border-radius:5px; border:1px solid #E3E3E3; background:#FBFBFB; color:var(--point); font-weight:500; transition:all ease .3s}
header nav .submenu .wrap>ul>li:hover>a{background:var(--color); border-color:var(--color); color:#fff}
header nav .submenu .wrap>ul ul{padding:.5rem 0px 0px 1rem}
header nav .submenu .wrap>ul ul li{position:relative; margin:.5rem 0px; padding-left:1.3rem;}
header nav .submenu .wrap>ul ul li:before{display:block; content:''; position:absolute; left:0px; top:1rem; width:.4rem; height:.4rem; background:var(--color); border-radius:10px; opacity:.3;}
header nav .submenu .wrap>ul ul li a{font-size:1.4rem; color:#424242; font-weight:300;}
header.on{background:#ffff !important; }
header nav .submenu.on{opacity:1; top:16rem; height:auto; z-index:1; }

header p[class^=btn_] a{display:block; position:relative; width:4.5rem; height:4.5rem; border-radius:.8rem; font-size:0px;}
header .btn_topsearch a{background-color:#45B740}
header .btn_topsearch a:before,
header .btn_topsearch a:after{display:block; content:''; position:absolute; transition:left ease .5s, right ease .5s, width ease .5s;; border-radius:40px}
header .btn_topsearch a.open:before{top:1rem; left:1rem; width:2rem; height:2rem;  border:3px solid #fff}
header .btn_topsearch a.open:after{top:2.7rem; left:2.4rem; width:1.1rem; height:.4rem; transform:rotate(45deg); background:#fff}
header .btn_topsearch a.close{background-color:#259095;}
header .btn_topsearch a.close:before,
header .btn_topsearch a.close:after{top:50%; left:25%; width:2.5rem; height:.3rem; transform:rotate(45deg); background:#fff; border:0px}
header .btn_topsearch a.close:after{transform:rotate(-45deg); }
header #topsearch{display:none; position:absolute; top:16rem; left:0px; width:100%; padding:4rem; background:#259095; z-index:1; }
header #topsearch form{position:relative; margin:auto; max-width:830px; background:#fff; border-radius:8px; overflow:hidden}
header #topsearch form input[type=text]{padding:0px 3%; width:calc(100% - 8rem); line-height:6.5rem; border:0px}
header #topsearch form input[type=submit]{position:absolute; width:8rem; height:100%; background:url(/open_content/council/img/inc/ic_topsearch.png) no-repeat center /4.5rem; border:0px; font-size:0px;}
header #topsearch form input::placeholder{color:#a6a6a6}
header .btn_allmenu a{background:#194361}
header .btn_allmenu a:before,
header .btn_allmenu a:after{display:block; content:''; position:absolute; top:1.3rem; left:28%; right:27%; height:2px; background:#fff; border-radius:10px}
header .btn_allmenu a:before{box-shadow:0px 1.6rem 0px #fff}
header .btn_allmenu a:after{margin-top:.8rem; right:42%}
.allmenu_close{position:absolute; top:0px; right:-10rem; }
.allmenu_close a{display:block; width:8.5rem; height:8.5rem; background:rgba(0,0,0,.6); border-radius:2rem; font-size:0px;}
.allmenu_close a:before,
.allmenu_close a:after{display:block; content:''; position:absolute; left:28%; top:48%; width:50%; height:.5rem; background:#fff; transform:rotate(45deg); border-radius:10px}
.allmenu_close a:after{transform:rotate(-45deg)}

footer{font-family:'Spoqa'; padding:6rem 0px; background:#f6f6f6}
footer *{color:#686868;}
footer .btm_banr{display:none; position:relative; margin-bottom:4rem; border:1px solid rgba(255,255,255,.2); border-width:1px 0px}
footer .btm_banr>div{margin:2rem 6rem; overflow:hidden}
footer .btm_banr .list{position:relative; white-space:nowrap}
footer .btm_banr ul.list>li{display:inline-block; position:relative; padding:0px 1.7rem;}
footer .btm_banr ul.list>li+li:before{display:block; content:''; position:absolute; left:-.2rem; top:50%; margin-top:-2px; width:.4rem; height:.4rem; border-radius:10px; background:#d9d9d9}
footer .btm_banr .control li{position:absolute; top:1.2rem;}
footer .btm_banr .control li.prev{left:0px; }
footer .btm_banr .control li.next{right:0px; }
footer .btm_banr .control li a{display:block; width:4rem; height:4rem; border-radius:100px; background:rgba(255,255,255,.2); font-size:0px;}
footer .btm_banr .control li a:After{display:block; content:''; position:absolute; left:42%; top:35%; width:1.2rem; height:1.2rem; border:0px solid #fff; border-width:1px 0px 0px 1px; transform:rotate(-45deg) }
footer .btm_banr .control li.next a:After{border-width:0px 1px 1px 0px; margin-left:-10%;}
footer .btm{display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between}
footer h1{font-family:'SCDream'; }
footer h1 a:before{background-position-x:-100px}
footer .btm .copy{margin-top:.4rem; letter-spacing:0px ;font-size:12px;}
footer .btm .btm_menu{display:flex; margin:2rem 0px}
footer .btm .btm_menu>li{position:relative; padding:0px 1rem}
footer .btm .btm_menu>li+li:before{display:block; content:''; position:absolute; left:0px; top:.7rem; width:1px; height:50%; background:#8f8f8f;}
footer .btm .btm_menu>li:first-child a{font-weight:normal; color:var(--point02)}
footer .btm .btm_menu>li:last-child{padding-right:0px;}
#main footer{margin-top:8.5rem; background:#737373}
#main footer *{color:#fff; font-weight:300;}
#main footer .btm_banr{display:block; margin-top:1rem;}
#main footer h1 *{font-family:'SCDream'; color:#dedede}
#main footer h1 a:before{background-position-x:-50px}
#main footer .btm .btm_menu>li:first-child a{color:#FFE559}


/***************************************************************************************************************************/


@media all and (min-width:801px){
	.dp_mb{display:none;}
	.pc_block {display: block;}
	#allmenu{display:none; position:absolute; left:0px; top:0px; width:100%; z-index:900;}
	#allmenu:before{content:''; position:fixed; left:0px; top:0px; bottom:0px; width:100%; height:100vh; background:rgba(108,108,108,.6); }
	#allmenu .wrap{position:relative; margin:16rem auto; padding:5rem 0rem 0px; background:#fff; z-index:1; border-radius:2rem}
	#allmenu .wrap>div{display:flex; gap:1rem; padding:2rem 3rem 5rem}
	#allmenu .wrap>div:nth-child(2n){background:#f8f8f8;}
	#allmenu .wrap>div>p{text-align:center; margin-top:2.5rem; width:35rem; font-size:2.4rem; font-weight:600}
	#allmenu .wrap>div>p:after{display:block; content:''; position:relative; margin:3rem auto; width:12.5rem; height:12.5rem; background:url(/open_content/council/img/inc/allmenu_ic.png?v1) no-repeat center top/cover}
	#allmenu .wrap>div.menu02>p:after{background-position-y:-125px}
	#allmenu .wrap>div.menu03>p:after{background-position-y:-250px}
	#allmenu .wrap>div.menu04>p:after{background-position-y:-375px}
	#allmenu .wrap>div.menu05>p:after{background-position-y:-500px}
	#allmenu .wrap>div.menu06>p:after{background-position-y:-625px}
	#allmenu .wrap>div.menu07>p:after{background-position-y:-750px}
	#allmenu .wrap>div.menu08>p:after{background-position-y:-900px}
	#allmenu .wrap>div:last-of-type{padding-bottom:8rem; border-radius:0px 0px 2rem 2rem}
	#allmenu .wrap>div>ul{display:flex; flex-wrap:wrap; flex-grow:1}
	#allmenu .wrap>div>ul>li{width:25%; margin-top:3rem}
	#allmenu .wrap>div>ul>li>a{font-weight:bold; color:#3DA189; font-size:1.8rem;}
	#allmenu .wrap>div>ul ul{padding:.5rem 0px 0px .2rem}
	#allmenu .wrap>div>ul ul li{position:relative; margin:.5rem 0px; padding-left:1.3rem;}
	#allmenu .wrap>div>ul ul li:before{display:block; content:''; position:absolute; left:0px; top:1rem; width:.4rem; height:.4rem; background:var(--color); border-radius:10px; opacity:.3;}
}

@media screen and (max-width:800px){
	.dp_pc{display:none;}
	.mb_block{display:block;}
	/* html.mbFix, html.mbFix body{overflow-y:hidden} */
	header #gnb .gnbL>li:not(.gnb_member){display:none;}
	header #gnb .gnbL>li.gnb_member{margin-left:-2rem;}
	header #gnb .gnbL>li.gnb_member:before{display:none;}
	header #gnb .gnbR>li>a{padding-left:2rem; background-size:1.9rem}
	header #gnb .gnbR>li.gnb_mypage>a {padding-left: 0;}
	#allmenu{display:none; position:fixed; left:0px; top:0px; width:100%; height:100%; background:#fff; z-index:900; }
	.allmenu_close a:before, .allmenu_close a:after{margin-top:-.5px; margin-left:-1px;height:2px;}
	#allmenu h1{margin:1rem 1rem 0rem; display:inline-block;}
	#allmenu .wrap{position:relative; width:100%; height:100%; padding-top:2rem; border-top:1px solid #14787C; --dep1W:16rem}
	#allmenu .wrap:before{content:''; position:absolute; left:0px; bottom:0px; top:0px; width:var(--dep1W); background:var(--graV); z-index:-1;}
	#allmenu .wrap>div{display:flex}
	#allmenu .wrap>div>p{cursor:pointer; padding:15px 2rem; width:var(--dep1W); color:#fff; font-size:1.7rem}
	#allmenu .wrap>div>ul{display:none; padding:1rem 3rem 10rem; width:calc(100% - var(--dep1W)); height:100%; position:absolute; top:0px; left:var(--dep1W); overflow-y:scroll}
	#allmenu .wrap>div>ul>li>a{display:block; position:relative; margin:1rem 0px; padding:2rem 1.5rem; background:#FBFBFB; color:var(--color); border:1px solid #D9D9D9; border-radius:5px; font-size:1.6rem; line-height:1;}
	#allmenu .wrap>div>ul>li.isDep>a:before,
	#allmenu .wrap>div>ul>li>a:after{display:block; content:''; position:absolute; right:2rem; top:50%; margin-top:-1.2rem; border:1px solid var(--color)}
	#allmenu .wrap>div>ul>li.isDep>a:before{width:2.4rem; height:2.4rem; border-radius:50px; }
	#allmenu .wrap>div>ul>li>a:after{width:.8rem; height:.8rem; margin-right:.9rem; margin-top:-.35rem; border-width:1px 1px 0px 0px; transform:rotate(45deg)}
	#allmenu .wrap>div>ul>li.isDep>a:after{margin-right:.8rem; margin-top:-.6rem; transform:rotate(135deg)}
	#allmenu .wrap>div>ul ul{display:none; padding-bottom:1rem;}
	#allmenu .wrap>div>ul ul li{position:relative; margin:.2rem 0px; padding-left:1.8rem;}
	#allmenu .wrap>div>ul ul li:before{display:block; content:''; position:absolute; left:1rem; top:1.5rem; width:.4rem; height:.4rem; background:var(--color); border-radius:10px; opacity:.3;}
	#allmenu .wrap>div>ul ul li a{display:block; padding:.5rem}
	#allmenu .wrap>div.on>p{position: relative; font-weight:600;}
	#allmenu .wrap>div.on>p:after{display:block; content:''; position:absolute; right:1.5rem; top:50%; margin-top:-8px; width:14px; height:14px; background:url(/open_content/council/img/inc/allmenu_arr.png) no-repeat center top/contain}
	#allmenu .wrap>div.on>ul{display:block}
	#allmenu .wrap>div>ul>li.on>a{background:var(--color); border-color:currentColor; color:#fff;}
	#allmenu .wrap>div>ul>li.on>a:before,
	#allmenu .wrap>div>ul>li.on>a:After{border-color:#fff;}
	#allmenu .wrap>div>ul>li.isDep.on>a:After{margin-top:-.2rem; transform:rotate(-45deg)}
	#allmenu .wrap>div>ul>li ul li.on a{font-weight:500}
	.allmenu_close{position:absolute; top:-6rem; right:5%}
	.allmenu_close a{width:4.5rem; height:4.5rem; font-size:0px; border-radius:.8rem}

	footer h1{display: none;}
	footer .btm{flex-direction:column; align-items:flex-start}
	footer .btm .copy{margin-top:.4rem; letter-spacing:0px ;font-size:12px;}
	footer .btm .btm_menu{flex-wrap:wrap; margin-bottom:0rem}
	footer .btm .btm_menu>li:first-child{padding-left:0px;}
	footer .btm .btm_menu>li:last-child{display:none;}
}