@charset "utf-8";
/**
공통 레이아웃
*/
.m{display:none !important;}
.mask{visibility:hidden; opacity:0; display:block; position:fixed; top:0; left:0; width:100%; height:100%; background-color:rgba(0,0,0,0.8); z-index:95; transition:0.3s ease;}
.mask.on{visibility:visible; opacity:1;}

body{width:100%; min-width:320px; overflow-x:hidden;}

#skip-navigation{z-index:9999; position:absolute; left:0; top:0;}
#skip-navigation *{list-style:none; margin:0; padding:0;}
#skip-navigation a{display:block; width:1px; height:1px; overflow:hidden; color:#000; white-space:nowrap;}
#skip-navigation a:focus,
#skip-navigation a:active{width:100px; height:auto; background:#ffd;}

.inner{position:relative; width:1200px; margin:0 auto;}
.inner:after{content:''; display:block; clear:both; width:100%;}

#header{position:relative; height:152px;}
#header .inner{padding:28px 0 0 0; text-align:right;}
.logo {z-index:94; position:absolute; top:23px; left:0; line-height:160%; text-align:left;}
.logo *{display:inline-block;}
.logo a{text-decoration:none; color:#222;}
.logo em{padding:4px 0 4px 0; line-height:100%; font-size:28px; font-weight:800; letter-spacing:-2px;}
.logo img{margin:0 4px 0 0; vertical-align:top;}
.logo span > span{display:block; font-size:10px; line-height:100%; font-weight:700; letter-spacing:0; text-transform:uppercase; color:#777;}

#top{width:100%; height:43px; background:#bbb; font-size:15px; font-weight:400;}
#top:after{content:''; display:block; clear:both; width:100%;}
#top .global{float:left;}
#top .global > li{position:relative; float:left; border-right:1px solid #bbb;}
#top .global > li > a{display:block; padding:0 32px; line-height:43px; color:#fff; background:#707070;}
#top .global > li > a:hover{background-color:#595959;}
#top .global > li > a:before{content:''; display:inline-block; height:17px; width:25px; vertical-align:top; margin:13px 0 0 0; background:url(/images/common/ico_global1.png) no-repeat;}
#top .global > li:nth-child(2) > a:before{width:23px; background-image:url(/images/common/ico_global2.png);}
#top .global > li:nth-child(3) > a:before{width:31px; background-image:url(/images/common/ico_global3.png);}
#top .global > li:nth-child(4) > a:before{background-image:url(/images/common/ico_global4.png);}
#top .global > li > a.current{color:#333; background:#fff;}
#top .global > li > a.current:before{background-position:0 100%;}
#top .global > li.list > a.on{color:#fff; background:#4b8fc1;}
#top .global .live a{background:#6a7487 !important;}
#top .global .live.on a{background:#d5525e !important;}
#top .global .live a:before{display:none;}

#top .global li div{display:none; z-index:98; position:absolute; top:43px; left:0; width:100%; padding:0 8px; background:#d8ebfe; box-sizing:border-box; border:1px solid #80c0f0; border-top:none; border-radius:0 0 4px 4px;  box-shadow:5px 10px 10px rgba(0,0,0,0.12);}
#top .global li div a{display:block; height:44px; line-height:44px; color:#222; border-top:1px dashed #5db7c8; text-align:center;}
#top .global li div li:first-child a{border-top:none;}
#top .global li div a:hover{font-weight:800;}
#top .global .list1 div{width:300px;}
#top .global .list1 li{display:inline-block; width:30%; margin:0 1.1%;}
#top .global .list1 li:nth-child(-n+3) a{border-top:none;}

#header .sns_wrap {position: absolute;top: 26px;right: 260px;display:flex;}
#header .sns_wrap li {margin: 0 0 0 9px;}
#header .sns_wrap li a {display:block;width: 38px;height: 38px;font-size: 0;background: url(/images/common/ico_fb.png);background-size: cover;}
#header .sns_wrap li a.insta {background-image: url(/images/common/ico_insta.png);}
#header .sns_wrap li a.yt {background-image: url(/images/common/ico_yt.png);}
#header .sns_wrap li a.blog {background-image: url(/images/common/ico_blog.png);}

.global2{display:inline-block; padding:10px 19px 0 0; font-size:15px; font-weight:400;}
.global2 li{position:relative; display:inline-block; padding:0 20px 0 0; line-height:100%; vertical-align:top;}
.global2 li:before{content:''; display:block; position:absolute; top:50%; right:0; height:9px; width:1px; margin:-5px 0 0 0; background:#aeaeae;}
.global2 li a{color:#444;}

#font_control {float:right;}
#font_control h2{float:left; padding:10px 12px 0 0; line-height:100%; font-size:15px; color:#444; font-weight:400;}
#font_control ul{float:left;}
#font_control li{float:left; width:33px; margin:0 0 0 1px; font-size:15px; font-weight:400; text-align:center;}
#font_control li a{display:block; height:33px; line-height:33px; color:#444; border:1px solid #d8d8d8; box-sizing:border-box;}
#font_control li.img a{text-indent:-999px; font-size:0; background:url(/images/common/ico_util.png) no-repeat 9px 9px;}
#font_control li.big a{background-position:10px -41px;}
#font_control li.small a{background-position:10px -85px;}
#font_control li a:hover{border-color:#888;}

.btn_menu{display:none; z-index:96; position:absolute; top:86px; right:0; width:29px; padding:4px 2px; border-radius:3px; background:none;} 
.btn_menu .bar{display:block; width:100%; height:3px; margin:4px 0 4px 0; background:#026190;}
.btn_menu_close{display:block; z-index:96; position:absolute; top:27px; right:3%; width:50px; height:50px; border-radius:50%; border:1px solid #d8e3f2; background:none;}
.btn_menu_close .bar{position:absolute; top:24px; left:12px; display:block; width:25px; height:1px; background:#d8e3f2;}
.btn_menu_close .bar1{transform:rotate(45deg);}
.btn_menu_close .bar2{transform:rotate(-45deg);}

/* 메인메뉴 */
#menuArea{overflow:hidden; position:absolute; left:0; top:134px; width:100%; z-index:93; border-bottom:1px solid #e2e2e2; font-weight:400; background:#fff url(/images/common/bg_menu.gif) repeat-x 0 2px;}
#menuArea.on{box-shadow:0 15px 15px rgba(0,0,0,0.15);}
#menuArea:before{z-index:1; content:''; display:block; position:absolute; top:61px; left:0; width:100%; height:1px; background:#e2e2e2;}
#menuArea .bar{display:block; position:absolute; top:58px; left:0; width:60px; height:3px; opacity:0; z-index:98; background:#026190; transition:0.3s;}

#topmenu{float:left; width:100%; padding:0 35px 0 0; box-sizing:border-box;}
#topmenu > li{position:relative; float:left; width:12%; line-height:0;}
#topmenu li.menu5{width:16%;}
#topmenu li.menu9,
#topmenu li.last{display:none;}
#topmenu > li > a{display:block; line-height:61px; font-size:20px; font-weight:700; text-align:center; letter-spacing:-1px; text-decoration:none; z-index:97;}

#topmenu > li:hover > a,
#topmenu > li > a:hover,
#topmenu > li > a:active,
#topmenu > li > a:focus,
#topmenu > li.current_on > a{color:#026190;}

#topmenu li .menu{display:none; z-index:96; width:100%; height:320px; padding:15px 0 0 0; margin:1px 0 0 0; box-sizing:border-box; border-right:1px solid #e5e5e5; background:#fff;}
#topmenu li:first-child .menu{border-left:1px solid #e5e5e5;}
#topmenu li:focus .menu,
#topmenu li:hover .menu{background:#fbfbfb;}

#topmenu li ul li{float:none; width:100%;}
#topmenu li ul li a{display:block; margin:0 0 10px 0; padding:0 3px 0 7px; color:#151515; font-size:16px; text-align:left; line-height:120%;}

#topmenu li li a:hover,
#topmenu li li a:active,
#topmenu li li a:focus,
#topmenu li li.current_on a{color:#026190;}

#topmenu ul ul{display:none !important;}

/* 검색*/
#search{z-index:94; position:absolute; top:156px; right:0; width:100%;}
#search:before{opacity:0; visibility:hidden; content:''; position:absolute; top:62px; left:50%; width:0; height:100%; transition:0.3s ease-in-out;}
#search.on:before{opacity:1; visibility:visible; left:0; width:100%; background:rgba(0,0,0,0.8);}
#search form{visibility:hidden; position:absolute; top:40px; left:50%; width:0; padding:40px 0 40px 25px; background:#37405b; box-sizing:border-box; opacity:0; transition:0.3s ease-in-out;}
#search form fieldset{display:block; position:relative; width:100%; padding:0 60px 0 0; max-width:1200px; margin:0 auto; box-sizing:border-box;}
#search.on form{opacity:1; visibility:visible; left:0; width:100%;}
#search input[type="text"]{width:100%; height:34px; line-height:36px; padding:0 35px 0 10px; border-radius:0; border:none; background:#fff; box-sizing:border-box;}
#search ::-webkit-input-placeholder{color:rgba(0,0,0,0.3);}
#search :-ms-input-placeholder{color:rgba(0,0,0,0.3);}
#search ::placeholder{color:rgba(0,0,0,0.3);}
#search button{position:absolute; top:0; right:13px; width:28px; height:29px; padding:0; font-size:0; text-indent:-999px; background:transparent;}
#search button:before,
#search button:after{content:''; display:block; position:absolute; top:0; left:0; width:25px; height:25px; border:3px solid #fff; border-radius:50%; box-sizing:border-box;}
#search button:after{top:auto; left:auto; bottom:0; right:0; width:13px; height:3px; border:none; border-radius:2px; transform:rotate(45deg); transform-origin:100% 100%; background:#fff;}
#search .btn_search{display:block; position:absolute; top:0; left:50%; width:21px; height:21px; padding:0; margin:0 0 0 575px; font-size:0; text-indent:-999px; background:transparent;}
#search .btn_search:before,
#search .btn_search:after{content:''; display:block; position:absolute; top:0; left:0; width:17px; height:17px; border:2px solid #0d2d4f; border-radius:50%; box-sizing:border-box; transition:0.3s ease;}
#search .btn_search:after{top:auto; left:auto; bottom:0; right:2px; width:9px; height:2px; border:none; border-radius:2px; transform:rotate(45deg); transform-origin:100% 100%; background:#0d2d4f;}
#search.on .btn_search:before{top:3px; width:25px; height:25px; border-radius:0; transform:rotate(45deg); border:none; border-left:2px solid #0d2d4f; transform-origin:50% 100%;}
#search.on .btn_search:after{right:0; width:25px; border-radius:0;}

/* 하단*/
.linksite{float:right; width:200px; font-size:14px; background:#555;}
.linksite:after{content:''; display:block; clear:both;}
.linksite > li{position:relative; padding:0 20px;}
.linksite > li > a{position:relative; display:block; height:54px; line-height:54px; padding:0 0 0 12px; color:#fff; border-bottom:1px solid rgba(255,255,255,0.15); transition:0.3s;}
.linksite > li:last-child > a{border:none;}
.linksite > li > a:after{content:''; display:block; position:absolute; top:50%; left:88%; width:10px; height:6px; margin:-3px 0 0 0; transition:0.3s; opacity:0.9; transform:rotate(180deg); background:url(/images/common/bg_bullet.png) no-repeat 0 -548px;}
.linksite > li:hover,
.linksite > li.on{background:rgba(255,255,255,0.1); box-shadow:0 0 5px rgba(0,0,0,0.25);}
.linksite > li.on > a:after{transform:rotate(0deg);}
.linksite li div{display:none; z-index:56; position:absolute; bottom:56px; left:0; width:100%; border:1px solid #dedede; border-bottom:none; box-shadow:0 2px 3px rgba(0,0,0,0.2); box-sizing:border-box; background:#fff;}
.linksite li div:before{content:''; display:block; position:absolute; bottom:0; right:0; width:150px; height:120px; opacity:0.4; background:url(/images/common/logo_l.png) no-repeat;}
.linksite li.on div{display:block;}
.linksite li div ul{width:100%; overflow-y:auto; max-height:350px; min-height:120px; margin:0 auto; padding:0.5em 0.7em 0.5em 1em; box-sizing:border-box;}
.linksite li div ul li{position:relative; display:inline-block; width:100%; box-sizing:border-box; vertical-align:top;}
.linksite li div ul li + li{border-top:1px dashed #ddd;}
.linksite li div ul li:before{content:''; display:block; position:absolute; top:14px; left:0; width:2px; height:2px; background:#aaa;}
.linksite li div ul li a{display:block; padding:8px 0 8px 0.5em;}
.linksite li div ul li a:hover{background:rgba(0,0,0,0.04);}

#footer{line-height:120%; color:rgba(255,255,255,0.7); font-size:15px; background:#666;}
#footer:after{content:''; display:block; clear:both; width:100%;}
#footer .link{display:inline-block; padding:40px 0 25px 0;}
#footer .link li{position:relative; display:inline-block; padding:0 20px; line-height:100%; vertical-align:top;}
#footer .link li + li:before{content:''; display:block; position:absolute; top:50%; left:0; width:1px; height:8px; transform:rotate(20deg) translateY(-50%); background:rgba(255,255,255,0.3);}
#footer .link li:first-child{padding-left:0;}
#footer .link li a{color:#fff;}
#footer .link li.privacy a{color:#e8ca62; font-weight:400;}
#footer address{margin:0 0 3px; font-size:16px;}
#footer .copyright{font-size:13px; text-transform:uppercase;}

/*
서브 레이아웃
*/
#container_sub{overflow:hidden; width:100%;}
#subContent{position:relative; max-width:1200px; margin:0 auto; padding:30px 0 5em 0;}
#subContent:after{content:''; display:block; clear:both;}
#subContent #content{float:right; width:73.33%;}

/* 서브메뉴 */
#submenu{z-index:1; position:relative; float:left; width:21.66%;}
#submenu .sm_tit{display:table; position:relative; width:100%; height:135px; margin:0 0 5px; text-align:center; letter-spacing:-1px; line-height:120px; color:#fff; background:#246d9e url(/images/kr/common/bg_subtit.gif) no-repeat;}
#submenu .sm_tit h2{display:table-cell; font-size:30px; font-weight:800; vertical-align:middle;}
#submenu .depth2 > li{margin:0 0 5px; line-height:0;}
#submenu .depth2 > li > a{position:relative; display:block; height:59px; line-height:57px; padding:0 0 0 23px; font-size:17px; font-weight:700; color:#312f2f; border:2px solid #eee; text-decoration:none; box-sizing:border-box; background:#eee; transition:0.3s ease;}
#submenu .depth2 > li > a:before{display:block; content:''; position:absolute; top:50%; right:0; width:0; height:3px; margin:-2px 0 0 0; transition:0.3s ease; background:#1b619f;}
#submenu .depth2 > li:hover > a,
#submenu .depth2 > li > a:hover,
#submenu .depth2 > li > a:focus,
#submenu .depth2 > li > a:active,
#submenu .depth2 > li.current_on > a{position:relative; color:#0d3650; border-color:#246e9e; background:#fff;}
#submenu .depth2 > li:hover > a:before,
#submenu .depth2 > li > a:hover:before,
#submenu .depth2 > li > a:focus:before,
#submenu .depth2 > li > a:active:before,
#submenu .depth2 > li.current_on > a:before{width:20px;}
#submenu .depth2 li ul {padding:10px 0 10px 24px; font-weight:400; background:#ebf1f5;}

#submenu .depth2 li ul li a{position:relative; display:block; padding:0.4em 0 0.4em 8px; font-size:100%; line-height:100%; color:#666;}
#submenu .depth2 li ul li a:before{content:''; display:block; position:absolute; top:12px; left:0; width:2px; height:2px; background:#79797a;}
#submenu .depth2 li ul li a:hover,
#submenu .depth2 li ul li a:focus,
#submenu .depth2 li ul li a:active,
#submenu .depth2 li ul li.current_on a{color:#0d3650;}
#submenu .depth2 li ul li a:hover:before,
#submenu .depth2 li ul li a:focus:before,
#submenu .depth2 li ul li.current_on a:before{background:#0d3650;}

/* 문서정보 */
.location{position:relative; height:50px; margin:-50px auto 0; font-weight:200; background:rgba(255,255,255,0.75); box-sizing:border-box;}
.location .home{position:relative; float:left; width:52px; height:50px; text-indent:-999px; font-size:0;}
.location .home:after,
.location .home:before{content:''; display:block; position:absolute; top:50%; left:50%; width:16px; height:16px; transform:translate(-50%, -50%); background:url(/images/common/ico_sub.png) no-repeat;}
.location .home:before{left:auto; right:0; width:1px; height:25px; margin:-12px 0 0 0; background:#aaa; transform:none;}
.location a:hover,
.location a:focus,
.snb > li > a.on{background-color:rgba(255,255,255,0.8);}
.snb{float:left;}
.snb > li{position:relative; float:left;} 
.snb > li{position:relative; float:left; width:200px;}
.snb > li > a{display:block; position:relative; line-height:50px; padding:0 0 0 18px;}
.snb > li > a:before,
.snb > li > a:after{content:''; display:block; position:absolute; top:50%; right:19px; width:10px; height:5px; margin:-3px 0 0 0; transition:0.3s; background:url(/images/common/ico_sub.png) no-repeat 0 -59px;}
.snb > li > a:before{right:0; width:1px; height:25px; margin:-12px 0 0 0; background:#aaa;}
.snb > li > a.on:after{transform:rotate(180deg);}
.snb ul{display:none; z-index:3; position:absolute; top:49px; left:0; width:100%; border:1px solid #e6e6e6; background:#fff; box-sizing:border-box; box-shadow:0 2px 3px rgba(0,0,0,0.1);}
.snb ul li{width:100%;}
.snb ul a{display:block; line-height:45px; padding:0 0 0 13px;}
.snb ul li + li a{border-top:1px solid #e6e6e6;}
.snb ul a.on,
.snb ul a:hover,
.snb ul a:focus,
.snb ul a:active{color:#fff; background:#707070 !important;}

#subVisual {position:relative; height:300px;}
#subVisual .img{position:absolute; left:50%; top:0; transform:translateX(-50%);}
#subVisual .slogan{position: absolute; top:50px; left:50%; width:1200px; margin:0 0 0 -600px; color:#fff; text-align:center;}
#subVisual .slogan div{padding:0 0 18px; line-height:120%; font-size:34px; font-weight:100; letter-spacing:-3px;}
#subVisual .slogan div strong{font-weight:800;}
#subVisual .slogan p{line-height:140%; color:rgba(255,255,255,0.7);}

#pageTitle{position:relative; width:100%;}
#pageTitle h3{position:relative; padding:32px 0 30px 0; margin:0 0 34px; line-height:100%; font-size:40px; font-weight:200; letter-spacing:-2px; border-bottom:1px solid #ddd;}
#pageTitle h3:after{content:''; display:block; position:absolute; bottom:-1px; left:0; width:80px; height:1px; background:#f4d360;}


@media all and (max-width:1220px) {
	#mainmenu,
	.inner,
	#subContent{width:96%;}

	#top .global > li > a {padding: 0 20px;}
	
	#search .btn_search{left:auto; right:15px; margin:0;}

	#subVisual .slogan{left:0; width:100%; margin:0;}
}
@media all and (max-width:1024px) {
	img{max-width:100%;}
	.m{display:inline-block !important;}
	.w{display:none;}

	.logo{top:13px; width:100%; text-align:center;}
	.logo *{vertical-align:top;}
	.logo img{height:43px; margin:0 2px 0 0;}
	.logo em{padding:4px 0 2px; font-size:25px;}
	.logo span{text-align:left;}
	.logo span > span{font-size:10px;}

	#header{height:70px; border-bottom:1px solid #e2e2e2;}
	#header .inner{width:100%; padding:0;}

	#top{height:35px; font-size:14px;}
	#top .btn_global{float:left; position:relative; width:150px; height:35px; line-height:36px; padding:0 7px 0 25px; margin:0; vertical-align:top; color:#fff; font-size:14px; background:#026190; box-sizing:border-box;}
	#top .btn_global:before{content:''; display:block; position: absolute; top:50%; left:10px; width:18px; height:12px; margin:-6px 0 0 0; background:url(/images/common/ico_more.png) no-repeat;}
	#top .btn_global:after{content:''; display:inline-block; margin:0 0 0 20px; border-top:6px solid #fff; border-left:5px solid transparent; border-right:5px solid transparent; vertical-align:middle; transition:0.3s ease;}
	#top .btn_global.on:after{transform:rotate(180deg);}
	#top .global{opacity:0; visibility:hidden; z-index:99; position:absolute; top:20px; left:0; width:150px; transition:0.3s ease; box-shadow:0 5px 5px rgba(0,0,0,0.15); background:#fff;}
	#top .btn_global.on + .global{opacity:1; visibility:visible; top:35px;}
	#top .global > li{float:none; border-left:1px solid #ddd; border-bottom:1px solid #ddd;}
	#top .global > li > a{padding:0; height:35px; line-height:37px; text-align:center; color:#555; background:#fff;}
	#top .global > li:last-child > a{background:#fff;}
	#top .global > li > a:hover,
	#top .global > li > a:last-child:hover{background-color:#f8f8f8;}
	#top .global a[target="_blank"]:after,
	#top .global > li:first-child > a:after{content:''; display:inline-block; width:10px; height:10px; margin:14px 0 0 6px; vertical-align:top; background:url(/images/common/ico_blank.png) no-repeat;}
	#top .global > li:first-child > a:after{width:13px; height:13px; margin-top:12px; background-image:url(/images/common/ico_home.png);}
	#top .global > li > a:before{display:none;}
	#top .global > li > a.on{background-color:#f7f7f7;}
	#top .global li div{top:-1px; left:100%; padding:0 5px; border-top:1px solid #80c0f0; border-radius:0 4px 4px 0; box-shadow:3px -3px 10px rgba(0,0,0,0.12);}
	#top .global .list1 div{width:300px;}
	#top .global li div a{height:35px; line-height:35px;}
	#top .global li div a[target="_blank"]:after{margin-top:12px;}
	#top .global > li.list > a:after{content:''; display:inline-block; width:8px; height:8px; margin:-4px 0 0 6px; border-right:1px solid #9a9999; border-bottom:1px solid #9a9999; vertical-align:middle; transform:rotate(-45deg); transition:0.3s ease;}
	#top .global > li.list > a.on:after{border-color:#fff;}

	#header .sns_wrap {top:-35px; right: 10px;}
	#header .sns_wrap li {margin: 0 0 0 5px;}
	#header .sns_wrap li a {width: 35px; height: 35px;}
	
	#font_control{display:none;}
	
	#search{top:60px;}
	#search .btn_search{right:10px;}
	#search form{top:45px;}

	.btn_menu{display:block; right:auto; left:10px; top:20px;}
	
	/* 모바일 메뉴 */
	.mask{display:block;}
	.m_menu{position:absolute; top:0; left:-100%; width:60%; height:100%; z-index:99; background:#246d9e; transition:0.5s ease-in-out;}
	.m_menu.on{left:0;}
	.m_menu .m_top{position:relative; height:106px;}
	.m_menu .logo{position:absolute; top:35px; left:2%; width:98%; text-align:left; transform:none;}
	.m_menu .logo a{color:#fff;}
	.m_menu .logo span > span{color:#fff;}
	.m_menu > ul{float:left; width:100%;}
	.m_menu > ul a{display:block; text-decoration:none; cursor:pointer;}
	.m_menu > ul > li{border-bottom:1px solid #246d9e;}
	.m_menu > ul > li > a{height:3em; line-height:3em; color:#fff; font-size:130%; padding:0 0 0 1em; background:#004f84 url(/images/common/bul_menu.png) no-repeat 95% -27px;}
	.m_menu > ul > li > .on{background-color:#159293; background-position:95% 20px;}
	.m_menu > ul > li > div {display:none; padding:1.3em 0.8em 0.7em 1.2em; background:#f2f9ff;}
	.m_menu > ul > li .on + div{display:block;} 
	.m_menu > ul > li > div > ul > li {margin:0 0 0.8em 0;}
	.m_menu > ul > li > div > ul > li > a{position:relative; padding:0 0 0 1.2em; font-size:115%;}
	.m_menu > ul > li > div > ul > li > a:before{content:''; display:block; position:absolute; top:5px; left:0.2em; width:13px; height:13px; border:4px solid #527eb8; border-left:4px solid #1b4a93; border-top:4px solid #114392;}
	.m_menu > ul > li > div > ul > li > ul{overflow:hidden; width:100%; margin:2px 0 0 0; padding:0.6em 0 0.4em 0.5em; box-sizing:border-box; border:1px solid #e6e6e6; border-radius:5px; background:#fff;}
	.m_menu > ul > li > div > ul > li > ul li{float:left; width:50%;}
	.m_menu > ul > li > div > ul > li > ul li a{position:relative; padding:2px 0 2px 10px;}
	.m_menu > ul > li > div > ul > li > ul li a:before{content:''; display:block; position:absolute; top:11px; left:2px; width:3px; height:3px; background:#4387d8;}

	.location{width:100%; margin:0; height:39px; border-bottom:1px solid #ddd;}
	.location .home{width:40px; height:38px;}
	
	.snb {font-size:14px;}
	.location .home:after{opacity:1;}
	.snb > li{width:162px;}
	.snb > li:first-child{width:110px;}
	.snb > li > a{opacity:1; height:38px; padding:0 0 0 13px; line-height:38px;}
	.snb > li > a:after{right:10px;}
	.snb ul{top:38px;}
	.snb ul a{line-height:35px;}

	#subContent{width:100%; padding:0 0 3em 0;}
	#subContent #content{width:100%;}
	#sub_default{padding:30px 2% 0;}

	#footer .inner{width:100%;}
	#footer .info{clear:both; width:100%; padding:0 10px 30px; text-align:center; box-sizing:border-box;}
	#footer .link{padding:35px 0 20px;}
	#footer address{font-size:15px;}
	#footer .copyright{font-size:12px;}

	.linksite{width:100%;}
	.linksite > li{float:left; width:33.3%; padding:0;}
	.linksite > li > a{height:45px; line-height:45px; border-bottom:none; border-right:1px solid rgba(255,255,255,0.15);}
	.linksite li div{bottom:46px;}

	#subVisual{height:auto;}
	#subVisual .img{position:static; transform:translateX(0);}
	#subVisual .slogan{top:20px;}
	#subVisual .slogan div{padding:0 0 5px; font-size:29px;}
	#subVisual .slogan p{display:none;}

	#pageTitle h3{padding:28px 0 20px; margin:0; font-size:28px; line-height:100%; text-align:center; letter-spacing:-1px; font-weight:800; border:none;}
	#pageTitle h3:after{left:50%; margin:0 0 0 -40px;}
}
@media all and (max-width:768px) {
	#top{height:30px;}
	#top .btn_global{height:30px; line-height:31px; font-size:13px;}
	#top .btn_global.on + .global{top:30px;}
	#top .btn_global:after{margin:0 0 0 15px;}
	#top .global > li > a[target="_blank"]:after{margin-top:12px;}
	#top .global > li > a.current:after{margin-top:10px;}
	#top .global .list1 div{width:240px;}

	#header .sns_wrap {top:-30px;}
	#header .sns_wrap li a {width: 30px; height: 30px;}
	
	#header{height:55px;}
	.logo{top:11px; font-size:16px;}
	.logo img{height:35px; margin:0 1px 0 0;}
	.logo em{font-size:20px; letter-spacing:-1px;}
	.logo span > span{font-size:8px;}
	
	.btn_menu{top:11px; width:33px; height:33px; padding:0 5px;}
	.btn_menu .bar{margin:3px 0;}
	.btn_menu_close{top:23px; width:34px; height:34px;}
	.btn_menu_close .bar{top:15px; left:4px;}
	
	#search{top:46px;}
	#search form{top:39px;}
	
	.m_menu .m_top{height:85px;}
	.m_menu .logo{top:23px;}
	.m_menu > ul > li > a{padding:0 0 0 0.7em; font-size:16px; background-size:17px auto; background-position:94% -17px;}
	.m_menu > ul > li > .on{background-position:94% 17px;}
	.m_menu > ul > li > div{padding:0.6em 0.7em 0.5em 0.7em;}
	.m_menu > ul > li > div > ul > li{margin:0 0 0.5em 0;}
	.m_menu > ul > li > div > ul > li > a{font-size:15px; background-size:13px;}
	.m_menu > ul > li > div > ul > li > a:before{top:3px;}
	.m_menu > ul > li > div > ul > li > ul{padding:0.5em 0 0.3em 0.4em;}
	.m_menu > ul > li > div > ul > li > ul li a{padding:0 0 0 10px; font-size:14px;}
	.m_menu > ul > li > div > ul > li > ul li a:before{top:8px;}

	.linksite li div:before{width:65px; height:60px; background-size:100px;}
	
	#footer,
	#footer address{font-size:14px;}
	#footer .link li{padding:0 15px;}
	#footer .copyright{font-size:11px;}

	#sub_default{padding:25px 2% 0;}

	#pageTitle h3{padding:23px 0 15px; font-size:24px;}
	
	#subVisual .slogan{top:15px;}
	#subVisual .slogan div{padding:0 0 5px; font-size:24px; letter-spacing:-2px;}
}
@media all and (max-width:568px) {
	.m_menu{width:280px;}
	.m_menu > ul > li > a{background-position:92% -17px;}
	.m_menu > ul > li > .on{background-position:92% 17px;}

	#top .global li div{padding:0 5px;}
	
	.location{height:36px; font-size:13px;}
	.location .home{width:30px; height:35px;}
	
	.snb {font-size:13px;}
	.snb > li{width:138px;}
	.snb > li:first-child{width:89px;}
	.snb > li > a{height:35px; padding:0 0 0 7px; line-height:35px;}
	.snb > li > a:after{right:7px;}
	.snb ul{top:35px;}
	.snb ul a{padding:0 0 0 9px; line-height:32px;}

	.linksite > li{width:100%;}
	.linksite > li > a{height:38px; line-height:38px; border-right:none; border-bottom:1px solid rgba(255,255,255,0.15);}
	.linksite > li > a:after{left:auto; right:17px;}
	.linksite li div{bottom:39px;}
	.linksite li div:before{width:150px; height:120px; background-size:auto;}
	
	#pageTitle h3{padding:18px 10px 10px; font-size:22px;}

	#subVisual .slogan{top:10px; font-size:13px;}
	#subVisual .slogan div{font-size:19px;}
	#subVisual .slogan div br{display:inline-block;}

	#footer,
	#footer address{font-size:13px;}
	#footer .link{width:100%; padding:28px 0 15px;}
	#footer .link li{padding:2px 5px 2px 9px;}
	#footer address span{display:block; padding:1px 0 2px 0;}
	#footer .copyright{font-size:10px;}
}
@media all and (max-width:400px) {
	#top,
	#top .btn_global{font-size:12px;}
	#top .btn_global,
	#top .global{width:125px;}
	#top .btn_global:before{width:16px;}
	#top .global > li > a{height:33px; line-height:35px;}
	#top .global li div{padding:0 3px;}
	#top .global li div a{height:33px; line-height:33px;}
	#top .global .list1 div{width:190px;}

	.logo{font-size:15px;}
	.logo img{height:33px;}
	.logo em{font-size:19px;}

	.m_menu > ul > li > div > ul > li > a{font-size:14px;}
	.m_menu > ul > li > div > ul > li > ul li a{font-size:13px;}

	#footer,
	#footer address{font-size:13px;}
	#footer address span{font-size:11px;}
	#footer .copyright{font-size:9px;}
	
	.linksite{font-size:13px;}
	.linksite > li > a{height:36px; line-height:36px;}
	.linksite li div{bottom:37px;}

	#sub_default{padding:20px 2% 0;}

	.snb{font-size:12px;}
	.snb > li:first-child{display:none;}
	.snb > li:last-child,
	.snb > li:nth-child(2){display:block;}

	#pageTitle h3{padding:15px 10px 8px; font-size:21px;}

	#subVisual .slogan{top:7px;}
	#subVisual .slogan div{font-size:16px;}
	#subVisual .slogan div br{display:inline-block;}
}