@charset "utf-8";

.headWrap {border-bottom:1px solid #d0d0d0;}


.popup-slide-view {display:none; position:fixed; top:0; left:0; right:0; bottom:0; background:rgba(0,0,0,.2); z-index:9999;}
.popup-slide-view .popup {display:block; position:absolute; font-size:1em; top:50%; left:50%; transform:translate(-50%, -50%); -webkit-transform:translate(-50%, -50%); width:900px; height:600px; max-width:95%; max-height:95%; z-index:1; background:#fff; border-radius:15px; padding:20px; box-sizing:border-box;
	box-shadow: 10px 10px 20px 0px rgba(9,22,56,0.2);
	-webkit-box-shadow: 10px 10px 20px 0px rgba(9,22,56,0.2);
	-moz-box-shadow: 10px 10px 20px 0px rgba(9,22,56,0.2);
}
.popup-slide-view .pop-title {display:block; position:relative; width:auto; left:auto; text-align:center; z-index:100; opacity:1; padding:2.68em 0 1.68em;}
.popup-slide-view .pop-title p {display:inline-block; position:relative; width:auto; height:auto; left:auto; line-height:1.2 !important; font-size:2.8125em !important; font-weight:800; color:#216cda !important;}
.popup-slide-view .pop-title p:after {content:""; display:block; position:absolute; left:100%; top:-.755em; width:1.3111em; height:1.08888em; background:url('../img/main/ico_gc_title.png') no-repeat 50% 50%; background-size:contain;}
.popup-slide-view .pop-title strong {color:#0a3a7b; font-weight:800;}
.popup-slide-view .pop-title .info {display:block; position:relative; text-align:center; background:#f7f7f7; border-radius:5px; padding:5px;}
.popup-slide-view .visual-goto {display:block; position:absolute; right:5.625em; top:-2em; overflow:hidden; text-indent:-999px; width:3.75em; height:3.75em; background:url('../img/main/ico_pop_close.png') no-repeat 50% 50% #3c4756; background-size:2.2rem auto; border-radius:9em; z-index:101;}
.popup-slide-view .list {display:block; position:absolute; top:8em; left:4rem; right:4rem; bottom:4rem; padding:0px; overflow:auto;}
.popup-slide-view .list:after {content:""; display:block; clear:both;}
.popup-slide-view .list::-webkit-scrollbar {width: 8px; height: 8px;}
.popup-slide-view .list::-webkit-scrollbar-thumb {background: #1273d7; border-radius: 10px;}
.popup-slide-view .list::-webkit-scrollbar-thumb:hover{background: #1273D7;}
.popup-slide-view .list::-webkit-scrollbar-track{background: #eaf0f5; border-radius: 8px;}
.popup-slide-view .list li {position:relative; box-sizing:border-box; width:33.33%; padding:10px; float:left;}
.popup-slide-view .list li img {display:block; max-width:100%; overflow:hidden; box-sizing:border-box;}
.popup-slide-view .list li span,
.popup-slide-view .list li a {display:block; position:relative; padding:0;}
.popup-slide-view .list li strong {display:block; font-size:1em; color:#333; font-weight:600; line-height:1.2; padding-top:.5em; text-align:center;}

@media all and (max-width:1024px) {
	.popup-slide-view .visual-goto {right:1em;}	
	.popup-slide-view .popup {font-size:14px;}
	.popup-slide-view .list {top:6.5em; left:1em; right:1em; bottom:1em;}
	.popup-slide-view .pop-title {padding:2em 0 1em;}
	.popup-slide-view .pop-title p {font-size:2em !important;}
	.popup-slide-view .list li {display:inline-block; vertical-align:top; padding:5px;}
}
@media all and (max-width:520px) {
	.popup-slide-view .list li {width:50%;}
}
@media all and (max-width:360px) {
	.popup-slide-view .list li {width:auto;}
}




/****************************************************************
	Visual Area
****************************************************************/

.visualWrap {position:relative;}
.visualWrap:after {content:""; display:block; clear:both;}

.mainMap {display:block; position:relative; width:550px; height:530px; float:left; z-index:0;}
.mainMap .tit {display:inline-block; position:relative; padding-top:3rem; font-size:2.6rem; color:#0e3274; font-weight:600; padding-bottom:1rem;}
.mainMap .tit:after {content:""; display:block; position:absolute; top:.5rem; right:-4rem; width:4.4rem; height:3.7rem; background:url(../img/main/spr_csc_main.png) no-repeat -8.3rem 0; background-size:30rem auto;}
.mainMap .txt {display:block; position:relative; color:#666; font-size:1.6rem; line-height:1.3;}
.mainMap .map {display:block; position:absolute; top:0; left:0; right:0; bottom:0; z-index:-1;}

.mainInfo {display:block; position:relative; width:500px; float:right; z-index:0; border-radius:2.4rem 0 2.4rem 0; overflow:hidden;
	-webkit-box-shadow: 2rem 2rem 3.5rem 0px rgba(14,50,116,0.15);
	-moz-box-shadow: 2rem 2rem 3.5rem 0px rgba(14,50,116,0.15);
	box-shadow: 2rem 2rem 3.5rem 0px rgba(14,50,116,0.15);
}
.mainInfo .thumb {display:block; position:relative; z-index:-1;}
.mainInfo .info {display:block; position:absolute; padding:4rem; left:0; right:0; bottom:0; background:url(../img/main/bak_info.png) no-repeat 100% 100% #0e3274; color:#fff;}
.mainInfo .info .tit {font-size:2.2rem; margin-bottom:1.7rem; font-weight:300;}
.mainInfo .info .tit:before {content:""; display:inline-block; position:relative; margin-right:.7rem; width:1.4rem; height:2rem; background:url(../img/main/spr_csc_main.png) no-repeat 0 0; background-size:30rem auto;}
.mainInfo .info li {display:block; position:relative; padding-left:9.3rem; line-height:1.4; font-weight:300; font-size:1.7rem;}
.mainInfo .info li:before {content:""; display:block; position:absolute; width:.7rem; height:.7rem; top:.7em; left:0; margin-top:-.35rem; background:url(../img/main/spr_csc_main.png) no-repeat -2.5rem 0; background-size:30rem auto;}
.mainInfo .info li + li {margin-top:.5rem;}
.mainInfo .info strong {display:block; position:absolute; top:0; left:1.3rem; font-weight:400 !important;}

@media all and (max-width:1024px) {
	.mainMap {width:48%; height:400px; float:left;}
	.mainInfo {width:48%; float:right;}
	
	.mainInfo .info {padding:2.5rem;}
	.mainInfo .info .tit {font-size:2rem;}
	.mainInfo .info li {font-size:1.6rem;}
}
@media all and (max-width:900px) {
	.mainMap {width:auto; float:none; clear:both; height:auto; padding-bottom:10rem;}
	.mainMap .tit {padding-bottom:2rem;}
	.mainMap .tit strong img {height:4rem;}
	.mainMap .txt {font-size:1.8rem;}
	.mainInfo {width:auto; float:none; clear:both;}
	.mainInfo .thumb {position:absolute; top:0; left:0; right:0; bottom:0; overflow:hidden;}
	.mainInfo .thumb img {max-width:100%; margin-top:-10rem !important;}
	.mainInfo .info {position:relative; float:right; width:50%; padding:3rem;}
	
	.mainMap .map {transform:translateY(-1rem); -webkit-transform:translateY(-1rem);}
	.mainMap .map img {display:block; float:right; max-height:100%;}
}
@media all and (max-width:640px) {
	.mainMap {padding-bottom:0;}
	.mainMap .tit strong img {height:3rem;}
	.mainMap .txt {font-size:1.5rem;}
	.mainMap .map {position:relative; transform:translateY(0); -webkit-transform:translateY(0); margin-top:-10%;}
	.mainMap .map img {float:none;}
	
	.mainInfo .thumb {position:relative;}
	.mainInfo .thumb:before {content:""; display:block; position:relative; padding-top:50%;}
	.mainInfo .thumb img {display:block; position:absolute; top:0; left:0; width:100%; margin:0 !important;}
	.mainInfo .info {width:auto; float:none;}
	.mainInfo .info .tit {font-size:1.8rem;}
	.mainInfo .info li {font-size:1.4rem; padding-left:6em;}
}


/****************************************************************
	Quick
****************************************************************/

.quickWrap {padding:5rem 0;}
.mainQuick {border:.5rem solid #e0e8f3; border-radius:1em;}
.mainQuick ul {display:table; width:100%;}
.mainQuick ul > li {display:table-cell; text-align:center; height:11rem; vertical-align:middle;}
.mainQuick ul.cnt-5 > li {width:20%;}
.mainQuick ul.cnt-4 > li {width:25%;}
.mainQuick ul.cnt-3 > li {width:33.33%;}
.mainQuick ul.cnt-2 > li {width:50%;}
.mainQuick ul > li + li {background:url(../img/main/bak_quick_line.png) no-repeat 0 50%;}
.mainQuick a {display:block; font-size:1.8rem; color:#0e3274;}
.mainQuick a:after {display:none !important;}
.mainQuick a span {display:inline-block; vertical-align:middle;}
.mainQuick .ico {display:inline-block; position:relative; margin-right:1.5rem; vertical-align:middle; width:3.6rem; height:3.9rem; background:url(../img/main/spr_csc_main.png) no-repeat 0 -3.6rem; background-size:30rem auto;}
.mainQuick .ico.ty2 {background-position:0 -9.1rem;}
.mainQuick .ico.ty3 {background-position:0 -15rem;}
.mainQuick .ico.ty4 {background-position:0 -20.8rem;}
.mainQuick .ico.ty5 {background-position:0 -26.6rem;}
.mainQuick .ico.ty6 {background-position:-6.1rem -9.1rem;}

@media all and (max-width:1024px) {
	.quickWrap {padding:3rem 0;}
	.mainQuick .ico {display:block; margin:0 auto 1.5rem; transform:scale(.9); -webkit-transform:scale(.9);}	
	.mainQuick a {font-size:1.6rem;}	
}
@media all and (max-width:640px) {
	.mainQuick .ico {transform:scale(.7); -webkit-transform:scale(.7); margin-bottom:.5rem;}	
	.mainQuick a {font-size:1.5rem;}	
}
@media all and (max-width:530px) {
	.mainQuick ul,
	.mainQuick ul > li {display:block; position:relative; height:auto; width:auto !important;}
	.mainQuick ul {padding:0 2rem;}
	.mainQuick ul > li + li {background:none; border-top:1px solid #bdcee5;}
	
	.mainQuick a {text-align:left; padding:1.5rem 0rem; font-size:1.6rem;}
	.mainQuick .ico {display:inline-block; position:relative; margin:0 1.5rem 0;}
	.mainQuick a span br {display:none;}
}


/****************************************************************
	Board Area
****************************************************************/

.boardWrap {display:block; position:relative; padding:0 0 9rem;}

.mainBoard {display:block; position:relative; margin-right:50rem; height:34rem;}
.mainBoard .tabs {padding-right:5rem; border-radius:.4rem; overflow:hidden;}
.mainBoard .tabs ul:after {content:""; display:block; clear:both;}
.mainBoard .tabs li {width:auto; float:left;}
.mainBoard .tabs li button {display:block; padding:0 .9rem; height:5rem; text-align:center; color:#777;}
.mainBoard .tabs li button.on {color:#fff; background:#3a81dc; padding:0 1.8rem; margin-right:1rem; border-radius:.4rem;}
.mainBoard .tabs li + li button.on {margin-left:1rem;}
.mainBoard .list {display:none;}
.mainBoard .list.on {display:block;}
.mainBoard .list li {display:block; position:relative; padding-left:1rem; line-height:1.2; overflow:hidden;}
.mainBoard .list li + li {margin-top:1.2rem;}
.mainBoard .list li:before {content:""; display:block; position:absolute; width:.3rem; height:.3rem; background:#555; left:0; top:.6em; margin-top:-.15rem;}
.mainBoard .list li a {display:block; position:relative; font-size:1.5rem; color:#555;}
.mainBoard .list li a .subj {display:block; position:relative; max-width:60%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-weight:400 !important;}
.mainBoard .list li a .con {display:none;}
.mainBoard .list li a .name {display:block; position:absolute; color:#3a81dc; top:0; bottom:0; right:9.6rem; letter-spacing:-0.03em;}
.mainBoard .list li a .date {display:block; position:absolute; top:0; bottom:0; right:0;}
.mainBoard .list li a .date > * {display:inline-block; vertical-align:middle; position:relative; color:#aaaaaa;}
.mainBoard .list li a .date i {width:.3em; height:1.2em; overflow:hidden; text-indent:-999px;}
.mainBoard .list li a .date i:before {content:"."; display:block; position:absolute; top:0; left:0; width:100%; bottom:0; text-indent:0; text-align:center; font-weight:800;}
.mainBoard .list li a .date strong {font-weight:400 !important;}
.mainBoard .list li:first-child {padding:0;}
.mainBoard .list li:first-child:before {display:none;}
.mainBoard .list li:first-child a {padding:2.7rem 0 2.7rem 13rem; margin-bottom:1.2rem; border-bottom:1px solid #dddddd;}
.mainBoard .list li:first-child a .name {display:none;}
.mainBoard .list li:first-child a .subj {color:#333; font-size:1.7rem; font-weight:800 !important; max-width:100%;}
.mainBoard .list li:first-child a .con {display:block; position:relative; font-size:1.5rem; color:#333333; line-height:1.4; height:2.9em; overflow:hidden; margin-top:1.9rem;}
.mainBoard .list li:first-child a .date {display:block; position:absolute; width:10rem; height:10rem; border-radius:100%; background:#eef4f5; color:#333333; text-align:center; padding-top:2rem; box-sizing:border-box; left:0; top:50%; margin-top:-5rem; color:#333;}
.mainBoard .list li:first-child a .date > * {color:#333;}
.mainBoard .list li:first-child a .date strong {display:block; font-size:4rem;}
.mainBoard .list li:first-child a .date i ~ i {position:absolute; top:0; right:0; z-index:-999; opacity:0;}
.mainBoard .list .more {display:block; position:absolute; width:5rem; height:5rem; top:0rem; right:0; overflow:hidden; text-indent:-999px;}
.mainBoard .list .more:after {content:""; display:block; position:absolute; width:1.6rem; height:1.6rem; top:50%; left:50%; margin-top:-.8rem; margin-left:-1.1rem; background:url('../img/main/spr_main.png') no-repeat 0 -3.7rem; background-size:40rem auto;}


.mainBoard .list li.no_data {display:block !important; position:relative !important; margin:0 !important; width:100% !important; text-align:center; padding:0 0; font-weight:400; color:#999; border:none !important;}
.mainBoard .list li.no_data:before{content:''; display:block; position:relative; margin:0 auto; width:202px; height:154px; background:url('/common/img/board/img_nodata.png') 50% 50% no-repeat; }


.mainPopup {display:block; position:absolute; width:45rem; height:34rem; border-radius:.8rem; right:0; top:0; background:#1abba5; padding:1rem 6rem 1rem 1rem; box-sizing:border-box;}
.mainPopup .control {display:block; position:absolute; top:2rem; right:.4rem; bottom:1.4rem; width:5.6rem;}
.mainPopup .control .pager {text-align:center;}
.mainPopup .control .pager > * {display:block; position:relative; font-family:'atomy', sans-serif; color:#fff;}
.mainPopup .control .pager em {color:#fff !important; font-weight:800;}
.mainPopup .control .pager i {width:1px; margin:1rem auto; height:1.5rem; background:#fff;}
.mainPopup .control .fr {display:block; position:absolute; bottom:0; left:0; right:0;}
.mainPopup .control button {display:block; position:relative; width:100%; height:2.5rem; overflow:hidden; text-indent:-999px;}
.mainPopup .control button.swiper-button-disabled {opacity:.8;}
.mainPopup .control button:before {content:""; display:block; position:absolute; width:1.8rem; height:1.8rem; top:50%; left:50%; margin-top:-.9rem; margin-left:-.9rem; background:url('../img/main/spr_main.png') no-repeat 0 -3.7rem; background-size:40rem auto;}
.mainPopup .control .play {display:none;}
.mainPopup .control .total {height:3rem;}
.mainPopup .control .prev:before {background-position:0 -14.9rem;}
.mainPopup .control .next:before {background-position:0 -19.8rem;}
.mainPopup .control .stop:before {background-position:0 -17.3rem;}
.mainPopup .control .play:before {background-position:-2.4rem -17.3rem;}
.mainPopup .control .total:before {background-position:0 -22.6rem;}
.mainPopup .slider {position:relative; overflow:hidden; z-index:0; height:100%;}
.mainPopup .slider .swiper-container {height:100%;}
.mainPopup .swiper-slide span,
.mainPopup .swiper-slide a,
.mainPopup .swiper-slide img {display:block; position:relative;}
.mainPopup .swiper-slide img {max-width:100%;}
.mainPopup .swiper-slide strong {display:none;}
.mainPopup .slider .swiper-slide {background:url(/common/img/board/sample_noimage.jpg) no-repeat 50% 50% #edf1fa;}
.mainPopup .slider .swiper-slide img[src*="noimage"] {opacity:0;}
.mainPopup.fix-scroll .swiper-slide a:before {content:""; display:block; position:absolute; top:0; left:0; right:0; bottom:0; z-index:99; border:10px solid #000;}


@media all and (max-width:1024px) {
	.boardWrap {padding-bottom:5rem;} 
	.mainBoard {margin-right:0; height:auto; margin-bottom:3rem;}
	.mainBoard .tabs {text-align:left;}
	.mainBoard .tabs li {display:inline-block; vertical-align:middle; float:none;}
	
	.mainPopupRows {position:relative; background:#1abba5; margin:0 -2rem;}
	.mainPopup {position:relative; margin:0 auto;}
}
@media all and (max-width:640px) {
	.boardWrap {padding-bottom:0;} 
	.mainBoard .tabs {padding:0; border-radius:0;}
	.mainBoard .tabs li {width:50%; float:left; position:relative; z-index:0;}
	
	.mainBoard .tabs li button {display:block; width:100%; height:6rem; font-size:2rem; border-radius:0; border:1px solid #ddd;}
	.mainBoard .tabs li + li button {border-left-width:0;}
	.mainBoard .tabs li + li button.on {margin-left:0;}
	.mainBoard .tabs li:nth-child(4) button {border-left-width:1px;}
	.mainBoard .tabs li:nth-child(3) ~ li button {border-top-width:0;}
	.mainBoard .tabs li button.on {border-radius:0;}
	.mainBoard .list li a {font-size:1.7rem;}
	.mainBoard .list li:first-child a {padding:4rem 0 4rem 13rem;}
	.mainBoard .list li:first-child a .subj {font-size:2.5rem; white-space:normal; word-break:keep-all; line-height:1.2; height:2.4em; overflow:hidden;}
	.mainBoard .list li:first-child a .con {display:none;}
	
	.mainBoard .list .more {display:block; position:relative; width:16rem; height:5rem; line-height:5rem; margin:2.5rem auto 0; text-indent:0; text-align:center; font-size:1.7rem; border:1px solid #dddddd; border-radius:9em;}
	.mainBoard .list .more:after {display:inline-block; position:relative; vertical-align:middle; top:auto; left:auto; margin:0; margin-left:.5rem; margin-top:-.4rem;}
	.mainBoard .list li a .date {display:none;}
	.mainBoard .list li a .name {right:0;}
}
@media all and (max-width:610px) {
	.mainBoard .tabs li button {height:5rem; font-size:1.7rem;}
	.mainBoard .list li:first-child a .subj {font-size:2rem;}
}
@media all and (max-width:450px) {
	.mainPopup {width:auto; height:auto;}
	.mainPopup:before {content:""; display:block; position:relative; padding-top:84.21052631%; z-index:-999;}
	.mainPopup .slider {position:absolute; top:1rem; left:1rem; right:6rem; bottom:1rem; height:auto;}
}
@media all and (max-width:430px) {
	.mainBoard .list li:first-child a {padding:3.5rem 0 3.5rem 8rem;}
	.mainBoard .list li:first-child a .subj {font-size:1.6rem;}
	.mainBoard .list li:first-child a .con {font-size:1.4rem; margin-top:1rem;}
	.mainBoard .list li:first-child a .date {width:7rem; height:7rem; margin-top:-3.5rem; font-size:1.3rem; padding-top:1.5rem;}
	.mainBoard .list li:first-child a .date strong {font-size:2rem;}
	
	.mainBoard .list li a {font-size:1.4rem;}
	
	.mainBoard .list .more {height:4rem; font-size:1.5rem; line-height:4rem;}
	.mainBoard .list .more:after {transform:scale(.8); -webkit-transform:scale(.8);}
}
@media all and (max-width:380px) {
	.mainBoard .tabs li button {font-size:1.5rem; height:4.5rem;}
}