@charset "utf-8";

.mEnter{display:block;}
.pEnter{display:inline-block;}
.blue{color:#0083ef}
.red{color:#d10000}
.display-none {display:none !important;}
@media all and (min-width:1200px) {
  .mEnter{display:inline-block;}
  .pEnter{display:block;}
}

#main {padding:100px 0 0;}
#main .pdinner {max-width:1460px;}
#main .bg {background:url('../img/nmain_bg.jpg') no-repeat right bottom / auto 78%; padding:0 0 40px;}

#main .sec01 .txt {letter-spacing:-0.08em; text-align:center; line-height:1.25;}
#main .sec01 .txt h3 {font-size:1.4em; font-weight:500; color:#333; transition:0.2s;}
#main .sec01 .txt h1 {font-size:2.1em; font-weight:900; transition:0.2s; background:-webkit-linear-gradient(0deg, #c37e60, #552e59); -webkit-background-clip:text; -webkit-text-fill-color:transparent; display:inline-block;}
#main .sec01 .sns {display:flex; margin:20px 0 0; justify-content:center;}
#main .sec01 .sns a {display:inline-block; background:#bcc0ca; width:40px; height:40px; border-radius:100%; margin-right:10px; transition:0.2s;}

#main .sec01 .popup {margin:40px 15% 10px; border-radius:20px; isolation:isolate; overflow:hidden !important; background:#eee; -webkit-box-shadow:0px 20px 40px 0px rgb(0 0 0 / 10%); box-shadow:0px 20px 40px 0px rgb(0 0 0 / 10%);}
#main .sec01 .popup .popup_wrap {position:relative; width:100%; height:0; overflow:hidden; padding-bottom:142%;}
#main .sec01 .popup .popup_inner {position:absolute; width:100%; height:100%;}
#main .sec01 .popup .slick-slide > div {display:flex;}
/*#main .sec01 .popup .slick-dots {background:rgba(0,0,0,0.8); position:absolute; right:15px; bottom:15px; border-radius:100px; padding:10px 70px 10px 10px; display:flex; align-items:center;}
#main .sec01 .popup .slick-dots li {display:inline-block; width:10px; height:10px; border-radius:100%; background:rgba(255,255,255,0.3); margin:0 5px;}
#main .sec01 .popup .slick-dots li.slick-active {background:#fff;}*/
#main .sec01 .popup .arrow {background:rgba(0,0,0,0.8); border-radius:100px; position:absolute; right:15px; bottom:20px; width:100px; padding:5px; height:30px; display:flex;}
#main .sec01 .popup .arrow span {flex:1; background-position:center center; background-repeat:no-repeat; background-size:20px; cursor:pointer;}
#main .sec01 .popup .arrow span.prev {background-image:url('../img/nmain_popup_arr_l.png')}
#main .sec01 .popup .arrow span.next {background-image:url('../img/nmain_popup_arr_r.png')}
#main .sec01 .popup .arrow span.dots {flex:2; display:flex; align-items:center; justify-content:center; text-align:center; font-size:12px; font-weight:600;}
#main .sec01 .popup .slick-dots li {color:#fff;}
#main .sec01 .popup .slick-dots li:not(.slick-active) {display:none;}

#main .sec01 .links {display:flex; flex-wrap:wrap; justify-content:space-between;}
#main .sec01 .links a {color:#fff; font-weight:600; width:49%; text-align:center; padding:10px 0; border-radius:20px; margin:5px 0; display:flex; align-items:center; flex-wrap:wrap; -webkit-box-shadow:0px 5px 10px 0px rgb(0 0 0 / 10%); box-shadow:0px 5px 10px 0px rgb(0 0 0 / 10%);}
#main .sec01 .links a:nth-child(1) {background:#552e59;}
#main .sec01 .links a:nth-child(2) {background:#73a899;}
#main .sec01 .links a:nth-child(3) {background:#db9d4b;}
#main .sec01 .links a:nth-child(4) {background:#c37e60;}
#main .sec01 .links a:nth-child(5) {background:#606678;}
#main .sec01 .links a:nth-child(6) {background:#888;}
#main .sec01 .links a:nth-child(7) {background:#3f434e;}
#main .sec01 .links a:nth-child(5),
#main .sec01 .links a:nth-child(6),
#main .sec01 .links a:nth-child(7) {width:32.33%}
#main .sec01 .links a img {display:block; margin:0 auto; width:80%; max-width:50px;}
#main .sec01 .links a p {width:100%;}

@media all and (min-width:640px) {
	#main .sec01 {display:flex; flex-wrap:wrap;}
	#main .sec01 .txt {width:100%; margin:0 0 40px;}
	#main .sec01 .popup {width:40%; margin:0 3% 0 0;}
	#main .sec01 .links {width:57%;}
}

@media all and (min-width:960px) {
	#main .sec01 {position:relative;}
	#main .sec01 .txt {width:70%; text-align:left; margin:0; background:url('../img/logo_bg.png') no-repeat 90% top / 20%;}
	#main .sec01 .txt h3 {font-size:1.8em;}
	#main .sec01 .txt h1 {font-size:2.7em;}
	#main .sec01 .sns {justify-content:flex-start;}
	#main .sec01 .popup {width:30%; margin:0;}
	#main .sec01 .links {position:absolute; left:0; bottom:0; width:calc(70% - 80px); height:50%;}
	#main .sec01 .links a {width:32.33%;}
  #main .sec01 .links a:nth-child(6),
  #main .sec01 .links a:nth-child(7) {width:15.66%}
}

@media all and (min-width:1200px) {
  #main {padding:170px 0 0;}
	#main .bg {padding:0 0 80px;}
	#main .sec01 .txt h3 {font-size:2.5em;}
	#main .sec01 .txt h1 {font-size:3.75em;}
  #main .sec01 .sns {margin:30px 0 0;}
  #main .sec01 .sns a:hover {background:#606678;}
	#main .sec01 .links a {font-size:1.25em; padding:20px 0; width:calc(33.33% - 12px); margin:18px 0 0; transition:0.2s;}
  #main .sec01 .links a:hover {transform:translateY(-10px); -webkit-box-shadow:0px 20px 20px 0px rgb(0 0 0 / 20%); box-shadow:0px 20px 20px 0px rgb(0 0 0 / 20%);}
}

#main .sec02 .bbs .tab {display:flex; position:relative; margin:40px 0 20px;}
#main .sec02 .bbs .tab dd {font-size:1.25em; font-weight:800; margin-right:0.5em; line-height:30px; transition:0.2s; cursor:pointer;}
#main .sec02 .bbs .tab dd span {color:#a9aaab;}
#main .sec02 .bbs .tab dd span.on {color:#111;}
#main .sec02 .bbs .tab dd a.more {position:absolute; right:0; top:0; display:none; width:30px; height:30px; background:url('../img/nmain_arr_r.png') center center no-repeat; background-size:100%;}
#main .sec02 .bbs .tab dd .tablinks.on ~ a.more {display:inline-block;}
#main .sec02 .bbs .tabcontent ul li {background:#fff; border-radius:20px; padding:10px 1em; margin:5px 0; -webkit-box-shadow:0px 5px 10px 0px rgb(0 0 0 / 10%); box-shadow:0px 5px 10px 0px rgb(0 0 0 / 10%); display:flex; align-items:center; flex-wrap:wrap;}
#main .sec02 .bbs .tabcontent ul li a {display:block; overflow:hidden; text-overflow:ellipsis; word-break:break-all; font-weight:600; width:100%;}
#main .sec02 .bbs .tabcontent ul li span.date {font-size:0.9em; color:#aaa;}

#main .sec02 .research {margin:40px 0 0; position:relative;}
#main .sec02 .research h3.tit {font-size:1.25em; font-weight:800; margin:0 0 30px;}
#main .sec02 .research .arrow {position:absolute; right:0; top:0; display:flex; width:60px; height:30px;}
#main .sec02 .research .arrow span {width:50%; background-position:center center; background-repeat:no-repeat; background-size:100%; cursor:pointer;}
#main .sec02 .research .arrow span.prev {background-image:url('../img/nmain_arr_l.png')}
#main .sec02 .research .arrow span.next {background-image:url('../img/nmain_arr_r.png')}
#main .sec02 .research ul li .img_wrap {position:relative; overflow:hidden; height:0; padding-bottom:130%; -webkit-box-shadow:0px 5px 10px 0px rgb(0 0 0 / 10%); box-shadow:0px 5px 10px 0px rgb(0 0 0 / 10%); margin:0 2.5% 10px;}
#main .sec02 .research ul li .img_wrap a {position:absolute; width:100%; height:100%; top:0; left:0;}
#main .sec02 .research ul li .img_wrap a span {position:absolute; right:10px; bottom:10px; background:rgba(63,67,78,0.8); color:#fff; padding:0.2em 0.4em; font-size:11px;}
#main .sec02 .research .slick-dots {text-align:center;}
#main .sec02 .research .slick-dots li {display:inline-block; width:10px; height:10px; border-radius:100%; background:#d1d2d5; margin:0 5px;}
#main .sec02 .research .slick-dots li.slick-active {background:#797c84;}

@media all and (min-width:480px) {
	#main .sec02 .bbs .tabcontent ul {display:flex; flex-wrap:wrap; justify-content:space-between; align-items:stretch;}
	#main .sec02 .bbs .tabcontent ul li {width:calc(50% - 5px);}
	#main .sec02 .bbs .tabcontent ul li a {line-height:1.5em; height:3em; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical;}
}

@media all and (min-width:768px) {
	#main .sec02 {margin:60px 0 0;}
	#main .sec02 .bbs .tab dd {font-size:1.5em; margin-right:0.75em;}
	#main .sec02 .bbs .tabcontent ul li {width:calc(33.33% - 6px);}
	#main .sec02 .bbs .tabcontent ul li a {font-size:1.1em;}
	#main .sec02 .research h3.tit {font-size:1.5em;}
}

@media all and (min-width:1080px) {
	#main .sec02 {display:flex; flex-wrap:wrap;}
	#main .sec02 .bbs {width:calc(100% - 470px); margin:0 80px 0 0;}
	#main .sec02 .bbs .tab {margin-bottom:40px;}
	#main .sec02 .bbs .tab dd {font-size:1.75em;}
	#main .sec02 .bbs .tabcontent ul li {height:120px; padding:20px;}
	#main .sec02 .research {width:390px;}
	#main .sec02 .research h3.tit {font-size:1.75em;}
}

@media all and (min-width:1200px) {
	#main .sec02 .bbs .tabcontent ul li {width:calc(33.33% - 20px); margin:0 0 30px;}
}

#main .sec03 {background:#868c9e; color:#fff; padding:40px 0;}
#main .sec03 .gall .tit {margin:0 0 20px;}
#main .sec03 .gall .tit h3 {font-size:1.25em; font-weight:800; margin:0 0 10px; word-wrap:break-word;}
#main .sec03 .gall .tit p {font-size:0.9em; color:rgba(255,255,255,0.8);}
#main .sec03 .gall .arrow {display:flex; width:60px; height:30px; margin:0 0 30px;}
#main .sec03 .gall .arrow span {width:50%; background-position:center center; background-repeat:no-repeat; background-size:100%; cursor:pointer;}
#main .sec03 .gall .arrow span.prev {background-image:url('../img/nmain_arr_l_w.png')}
#main .sec03 .gall .arrow span.next {background-image:url('../img/nmain_arr_r_w.png')}
#main .sec03 .gall .slick-slide {margin: 0 10px;}
#main .sec03 .gall .slick-list {margin: 0 -10px;}
#main .sec03 .gall .slick-list p {margin:20px 0 0; text-overflow:ellipsis; white-space:nowrap; word-wrap:normal; overflow:hidden;}

@media all and (min-width:768px) {
	#main .sec03 .gall .tit h3 {font-size:1.5em;}
}

@media all and (min-width:1080px) {
	#main .sec03 {padding:80px 0;}
	#main .sec03 .gall_slider_wrap {display:flex;}
	#main .sec03 .gall .lbox {width:25%; padding-right:40px;}
	#main .sec03 .gall .rbox {width:75%;}
	#main .sec03 .gall .tit h3 {font-size:1.75em; margin:0 0 30px;}
	#main .sec03 .gall .tit p {font-size:1em;}
	#main .sec03 .gall .arrow {position:absolute; bottom:0; margin:0 0 10px;}
}

#main .sec04 {background:#3f434e; color:#fff; padding:40px 0;}
#main .sec04 .box_wrap {display:flex; flex-wrap:wrap;}
#main .sec04 .box {width:49%; text-align:center; position:relative; margin:0 0 10px;}
#main .sec04 .box01,
#main .sec04 .box03 {margin-right:2%;}
#main .sec04 .box .box_inner {position:relative; overflow:hidden; height:0; padding-bottom:131.25%; background-size:100%; background-position:center center; z-index:10;}
#main .sec04 .box .box_inner:after {content:''; display:inline-block; width:100%; height:100%; position:absolute; left:0; top:0;}
#main .sec04 .box01 .box_inner:after {background:rgb(195,126,96,0.5); background:linear-gradient(180deg, rgba(195,126,96,0) 0%, rgba(195,126,96,0.8) 100%);}
#main .sec04 .box02 .box_inner:after {background:rgb(195,126,96,0.5); background:linear-gradient(180deg, rgba(219,157,75,0) 0%, rgba(219,157,75,0.8) 100%);}
#main .sec04 .box03 .box_inner:after {background:rgb(195,126,96,0.5); background:linear-gradient(180deg, rgba(115,168,153,0) 0%, rgba(115,168,153,0.8) 100%);}
#main .sec04 .box04 .box_inner:after {background:rgb(195,126,96,0.5); background:linear-gradient(180deg, rgba(85,46,89,0) 0%, rgba(85,46,89,0.8) 100%);}
#main .sec04 .box01 .box_inner {background-image:url('../img/nmain_box_img01.jpg');}
#main .sec04 .box02 .box_inner {background-image:url('../img/nmain_box_img02.jpg');}
#main .sec04 .box03 .box_inner {background-image:url('../img/nmain_box_img03.jpg');}
#main .sec04 .box04 .box_inner {background-image:url('../img/nmain_box_img04.jpg');}
#main .sec04 .box a {position:absolute; width:100%; height:100%; top:0; left:0; display:flex; flex-wrap:wrap; align-items:flex-end; justify-content:center; z-index:10; padding:0 0 20px;}
#main .sec04 .box a div {width:100%; line-height:1.25;}
#main .sec04 .box a h3 {font-size:1.25em; font-weight:700; margin:0 0 10px; word-break:break-all;}
#main .sec04 .box a p {font-size:0.9em; padding:0 10%; line-height:1.35;}
#main .sec04 .box a span.btn {display:inline-block; height:40px; line-height:40px; width:80%; max-width:140px; border-radius:100px; background:#fff; font-weight:700; font-size:0.9em; margin:20px 0 0; overflow:hidden;}
#main .sec04 .box01 a span.btn {color:#c37e60;}
#main .sec04 .box02 a span.btn {color:#db9d4b;}
#main .sec04 .box03 a span.btn {color:#73a899;}
#main .sec04 .box04 a span.btn {color:#552e59;}

@media all and (min-width:768px) {
	#main .sec04 .box {width:23.8%; margin:0 1.6% 0 0;}
	#main .sec04 .box a span.btn {height:0; line-height:0; margin:0; opacity:0; transition:0.2s;}
	#main .sec04 .box:hover a span.btn {height:40px; line-height:40px; margin:20px 0 0; opacity:1;}
	#main .sec04 .box04 {margin:0 !important;}
}

@media all and (min-width:1080px) {
	#main .sec04 {padding:80px 0;}
	#main .sec04 .box {width:calc(25% - 30px); margin:0 40px 0 0;}
	#main .sec04 .box a h3 {font-size:1.75em; margin:0 0 20px;}
	#main .sec04 .box a p {font-size:1em;}
	#main .sec04 .box a span.btn {font-size:1em;}
	#main .sec04 .box:hover a span.btn {margin:40px 0 0;}
}

#main .sec05 {padding:40px 0;}
#main .sec05 .tit {margin:0 0 20px; position:relative;}
#main .sec05 .tit h3 {font-size:1.25em; font-weight:700; line-height:30px;}
#main .sec05 .tit .arrow {position:absolute; right:0; top:0; display:flex; width:70px; height:30px; justify-content:space-between;}
#main .sec05 .tit .arrow span {width:30px; background-position:center center; background-repeat:no-repeat; background-size:20px; cursor:pointer; border-radius:50%; -webkit-box-shadow:0px 5px 10px 0px rgb(0 0 0 / 10%); box-shadow:0px 5px 10px 0px rgb(0 0 0 / 10%);}
#main .sec05 .tit .arrow span.prev {background-image:url('../img/nmain_ban_arr_l.png')}
#main .sec05 .tit .arrow span.next {background-image:url('../img/nmain_ban_arr_r.png')}
#main .sec05 li img {margin:0 auto; max-width:90%;}

@media all and (min-width:768px) {
  #main .sec05 {padding:60px 0;}
	#main .sec05 .ban {display:flex; flex-wrap:wrap; align-items:center;}
	#main .sec05 .ban .tit {width:200px; margin:0;}
	#main .sec05 .ban .ban_slider_wrap {width:calc(100% - 200px); padding:0 0 0 40px;}
	#main .sec05 .tit h3 {font-size:1.5em;}
}





/*
	Common Layout CSS _ 15.05.18
*/

/*common*/
.wrap{max-width:2000px; min-width:320px; width:100%; margin:0 auto; position:relative;}
.inner{max-width:1200px; width:100%; position:relative; margin:0 auto;}
.pdinner{max-width:1200px; padding:0 3%; position:relative; margin:0 auto;}
.ofh{overflow:hidden;}
.txt-s{font-size:13px;}
.txt-m{font-size:20px;}
.txt-l{font-size:26px;}

.tit_h3{font-size:28px;font-weight:400; color:#323232;  position:relative; letter-spacing:-1px}
.tit_h3:after{content:''; width:60px; height:1px; display:block; background:#505050; margin:0 auto; margin-top:20px;}
.tit_h4{font-size:26px; color:#323232; font-weight:bold; letter-spacing:-1px}

.tit_h5{color:#323232; font-weight:bold; font-size:18px;}

.tit_h4.noLine:after{width:0; height:0px; margin-top:0px;}


.mEnter{display:block;}
.mb{margin-bottom:30px !important}
.bmb{margin-bottom:40px !important}
.pb{padding-bottom:30px !important}
.bpb{padding-bottom:40px !important}

.mb10{margin-bottom:10px !important;display: block;}
.mb20{margin-bottom:20px !important;}

.tac{text-align:center;}
.tal{text-align:left;}
.tar{text-align:right;}
.mo_only{display:block;}

.move_scroll{max-width:768px; overflow-x:auto}

.line_link{display:inline-block; color:#ffffff; padding-bottom:5px; border-bottom:3px solid #ffffff; font-size:0.9em}
.arrow_cir_w:after{content:''; width:28px; height:25px; background:url(../img/ic_arrow_w.png) no-repeat center center; background-size:100%; display:inline-block; vertical-align:middle; margin-left:10px;}

.dpib{display:inline-block}
.dpb{display:block;}

.upper{text-transform:uppercase}
.fwb{font-weight:600}
.fss{font-size:0.8em}
.Tblack{color:#323232}
.Tred{color:#e83428}
.upcase{text-transform:uppercase}

.btn_more{display:inline-block; color:#ffffff; background:#1c3f95; padding:6px 20px; border-radius:500px; vertical-align:middle; position:relative; z-index:1}
.btn_more:after{content:'+'; display:inline-block; margin-left:10px; vertical-align:middle}

.btn_more.wt_btn{border:1px solid #dcdcdc; background:none; }

@media all and (min-width:768px) {

.txt-s{font-size:15px;}
.txt-m{font-size:20px;}
.txt-l{font-size:30px;}

.tit_h4{font-size:30px; letter-spacing:-1px}
.tit_h5{font-size:20px; letter-spacing:-1px}


.mb{margin-bottom:40px !important; }
.bmb{margin-bottom:60px !important;}

.pb{padding-bottom:40px !important}
.bpb{padding-bottom:60px !important}

.mo_only{display:none;}
.move_scroll{max-width:100%;}
.pdinner{padding:0 3%}

.half{width:48.5%; float:left;}
.mr{margin-right:3%;}
.btn_more:after{margin-left:20px}
}

@media all and (min-width:1200px) {

body, html{font-size:16px; line-height:1.5}
.mEnter{display:inline-block;}

.txt-m{font-size:30px;}
.txt-l{font-size:40px;}

.tit_h3:after{margin-top:25px;}

.tit_h4{font-size:30px; }

.tit_h5{font-size:20px; }


.mb{margin-bottom:50px !important}
.bmb{margin-bottom:80px !important}

.pb{padding-bottom:50px !important}
.bpb{padding-bottom:80px !important}
.pdinner{padding:0 20px}

}

@media all and (min-width:1200px) {

}


/*footer*/
#footer{border-top:1px solid #e0e0e0; font-size:0.9em; text-align:center; padding:40px 0 60px;}
#footer .pdinner{max-width:1600px}
#footer .sns {display:flex; justify-content:center; margin:0 0 20px;}
#footer .sns a {margin:0 5px;}
#footer .sns a img {width:30px;}
#footer .drop {position:relative; display:inline-block; margin:0 auto 40px;}
#footer .drop .dropbtn {border:1px solid #e0e0e0; background:#fff url('../img/nmain_drop_ic.png') no-repeat 95% center / 18px; width:190px; text-align:left; padding:0 10px; color:#888; font-weight:700; height:40px;}
#footer .drop .dropmenu {display:none; z-index:99; position:absolute; top:40px; left:0;  width:190px; background:#fff; border:1px solid #e0e0e0; border-top:0; padding:0.5em 0; color:#888;}
#footer .drop .dropmenu.show {display:block;}
#footer .drop .dropmenu a {padding:5px 0; display:block;}
#footer p{font-size:0.85em; clear:both; margin-top:10px; color:#999;}
#footer p .adm {margin:0 0 0 0.5em; background:#ccc; color:#fff; padding:0.1em 0.3em;}

#footer #list_btn {display:none;}
#footer #list_box {display:none;}

.bottom_li {text-align:center; margin:0 0 20px;}
.bottom_li li {display:inline-block; margin:0 0.5em; position:relative; line-height:20px;}
.bottom_li li:first-child a {color:#552e59;}
.bottom_li li:first-child:before {display:none;}
.bottom_li li a {color:#111; font-weight:700;}

@media all and (min-width:768px) {
  #footer  {padding:60px 0 80px;}
  #footer .footer_wrap {display:flex; flex-direction:row-reverse; justify-content:space-between; align-items:flex-start;}
  #footer .footer_wrap .lbox {text-align:left;}
  #footer .footer_wrap .rbox .sns {display:none;}

  .bottom_li {text-align:left;}
  .bottom_li li {margin:0 1em 0 0;}
}

@media all and (min-width:1080px) {
  #footer  {font-size:1em;}
  #footer .footer_wrap .rbox {display:flex; align-items:center;}
  #footer .footer_wrap .rbox  .drop {margin:0;}
  #footer .footer_wrap .lbox {background:url('../img/logo.png') no-repeat left top / 180px; padding:0 40px 0 220px;}
}

@media all and (min-width:1200px) {
  #footer .footer_wrap .rbox {min-width:400px;}
  #footer .footer_wrap .rbox .sns {display:inline-block; margin:0 40px 0 0;}
}

@media all and (min-width:1280px) {
  #footer {padding:80px 0 100px;}
  #footer .footer_wrap .lbox {background-size:200px; padding:0 0 0 260px;}
}


/*page up*/
#pageup {position:fixed; z-index:999; right:1%; bottom:5%; width:50px; height:50px; background:#c37e60 url('../img/ic_top.png') no-repeat center 48% / 12px; border-radius:50%; display:none; cursor:pointer; z-index:4000;}


/*animation*/
.motion01{animation-name:sub_tt;animation-duration:1000ms;animation-fill-mode:both;animation-delay:200ms;animation-timing-fonction:ease-out;}
.motion02{animation-name:sub_tt;animation-duration:1000ms;animation-fill-mode:both;animation-delay:200ms;animation-timing-fonction:ease-out;}

/* Chrome, Safari, Opera */
@-webkit-keyframes sub_tt {
	0%   {top:30px; opacity:0;}
    100% {top:0; opacity:1;}
}
/* Standard syntax */
@keyframes sub_tt {
     0%   {top:30px; opacity:0;}
    100% {top:0px; opacity:1;}
}
/* Chrome, Safari, Opera */
@-webkit-keyframes sub_tt {
    0%   {top:30px; opacity:0;}
    100% {top:0; opacity:0;}
}
/* Standard syntax */
@keyframes sub_tt {
     0%   {top:30px; opacity:0;}
    100% {top:0px; opacity:1;}
}

.anim01 {animation-name:anim01; animation-duration:1s; animation-fill-mode:both;}
@keyframes anim01 {
	0% {opacity:0; transform:translateY(-1000px);}
    60% {opacity:1; transform:translateY(30px);}
    80% {transform:translateY(-10px);}
    100% {transform:translateY(0); }
}
.anim02 {animation-name:anim02; animation-duration:1s; animation-fill-mode:both;}
@keyframes anim02 {
	0% {opacity:0; transform:translateY(1000px);}
    60% {opacity:1; transform:translateY(-30px);}
    80% {transform:translateY(10px);}
    100% {transform:translateY(0); }
}
.anim03 {animation-name:anim01; animation-duration:1s; animation-fill-mode:both;}
@keyframes anim01 {
	0% {opacity:0; transform:translateY(-100px);}
    40% {opacity:1; transform:translateY(20px);}
    60% {transform:translateY(-10px);}
    100% {transform:translateY(0); }
}
.anim04 {animation-name:anim02; animation-duration:1s; animation-fill-mode:both;}
@keyframes anim02 {
	0% {opacity:0; transform:translateY(100px);}
    40% {opacity:1; transform:translateY(-20px);}
    60% {transform:translateY(10px);}
    100% {transform:translateY(0); }
}
.anim05 {animation-name:anim05; animation-duration:1s; animation-fill-mode:both;}
@keyframes anim05 {
	0% {transform:translateY(0);}
    50% {transform:translateY(-10px);}
    100% {transform:translateY(0); }
}

@media all and (max-width:1200px) {
#layerPopup0{top:100px !Important; left:0 !Important;}
#layerPopup1{top:435px !Important; left:0 !Important;}
#layerPopup2{top:770px !Important; left:0 !Important;}
#layerPopup3{top:1105px !Important; left:0 !Important;}
#layerPopup4{top:1440px !Important; left:0 !Important;}
#layerPopup5{top:1775px !Important; left:0 !Important;}
}





/*서브레이아웃공통*/
.dot_li_wrap {background:#fafafa; padding:20px 0;}
.dot_li{overflow:hidden;}
.dot_li > li{position:relative; padding-left:15px; margin-bottom:3px; word-break:break-all}
.dot_li > li:before {content:''; display:inline-block; width:4px; height:4px; border-radius:50%; left:0; top:10px; position:absolute; background:#7b7b7b;}
.dot_li > li:last-child{margin-bottom:0;}
.dot_li2 > li{position:relative;padding-left: 10px;margin-bottom: 0px;word-break:break-all;color: #555;}
.dot_li2 > li:before {content:''; display:inline-block; width:2px; height:2px; border-radius:50%; left:0; top:10px; position:absolute; background:#7b7b7b;}
.dot_li2 > li:last-child{margin-bottom:0;}
.pdl{padding-left: 37px;}
.dot_li li.ref {font-size:0.9em; color:#666; margin:15px 0; background:#fcfcfc; border:1px dotted #ccc; padding:10px 30px;}
.dot_li li.ref:before {display:none;}
.dot_li li span.label {font-weight:600; margin-right:10px; display:block;}
.tit_dot{font-size:1.25em; color:#303030; font-weight:800; padding-left:30px; background:url('../img/tit_cir.png') no-repeat left center;}
.tit_dot a.btn {font-size:0.65em; font-weight:400; display:inline-block; color:#fff; background:#505050;
	line-height:30px; padding:0 10px; margin-left:10px; float:right; border-radius:2px;}
.tit_dot a.btn:hover {background:#fafafa;}
.img_li {display:flex; flex-wrap:wrap;}
.img_li li {width:48%; margin:0 1% 10px; text-align:center; font-weight:500;}
.img_li li img {width:100%; margin:0 0 10px;}
.img_box{text-align:center;/* border: 1px solid #dedede; */padding: 17px;background: #f8f8f8;}
.img_box img{
    max-width: 400px;
}
.img_li2{
    display: flex;
    gap: 10px;
}
.img_li2 > li{}
@media all and (min-width:768px) {
	.dot_li li span.label {display:inline-block;}
  .img_li li {width:31.33%;}
	.img_li2{
    gap: 20px;
}
}

/*서브레이아웃*/
#sub_vis{position:relative; padding:30px 0; background-repeat:no-repeat; background-position:center center; background-size:cover !important; color:#fff; text-align:center;}
#sub_vis .tit_h2{font-weight:800; font-size:1.25em; transition:0.2s;}
#sub_vis .tit_h2 span{display:block;  margin-bottom:10px; font-size:15px; font-weight:800; letter-spacing:-0.1em; text-transform:uppercase; position:relative;}
#sub_vis .tit_txt {font-size:0.85em; margin-top:0.5em; color:#fff;}

@media all and (min-width:768px) {
	#sub_vis{border-bottom:0; padding:60px 0px 40px;}
	#sub_vis .tit_h2{font-size:2em;}
	#sub_vis .tit_h2 span:after{position:absolute; right:0; top:0; margin:0}
	#sub_vis p{font-size:18px}
}

@media all and (min-width:1200px) {
	#sub_vis{border-bottom:0; padding:150px 0px 60px;}
	#sub_vis .tit_h2{font-size:2.5em;}
}

.sub_tab{display:none}
#sub{margin:0 auto 80px; position:relative; min-height:400px; padding:50px 0% 0px; overflow:hidden}
#sub:after{content:''; clear:both; display:block}

/*2depth menu*/
#twodepthNav {position:relative; display:none; margin:0 auto; background:#e7211a}
#twodepthNav ul {overflow:hidden; text-align:center}
#twodepthNav ul li {position:relative; width:16%; display:inline-block; text-align:center; max-width:150px}
#twodepthNav ul li a{color:#ffffff}
#twodepthNav ul.li09 li{width:10.5%;}
#twodepthNav ul li a{display:block; line-height:60px; position:relative}
#twodepthNav ul li a:after{content:''; position:absolute; bottom:0; left:50%; width:0; height:4px; background:#0083ef; transition:all 0.2s cubic-bezier(0.7, 0, 0.3, 1)}
#twodepthNav ul li:hover a:after{width:60px; margin-left:-30px;}
#twodepthNav ul li a:hover{font-weight:600; transition:0.3s}
#twodepthNav ul li:first-child a:before{width:0}
#twodepthNav ul li.active {background:#ffffff}
#twodepthNav ul li.active a{font-weight:600; color:#323232}
#twodepthNav ul li.active a:after{width:60px; margin-left:-30px;}

#sidemenu {display:none; position:absolute;width:200px;  z-index:9999; top:0px; left:20px} /*기준*/
#sidemenu h2 {display:block;font-size:1.6em;   text-align:center; line-height:1.2;  color:#fff; min-height:100px; padding:60px 0; /*background:rgba(90,19,40,0.8);*/ background:#29343f; position:relative; text-transform:uppercase;  }
#sidemenu h2 span {display:block; font-size:0.9rem; margin-bottom:10px;}

#sidemenu .snblist{border:1px solid #e6e6e6; border-width:0 1px 1px; background:#ffffff;  margin-bottom:30px}
#sidemenu .snblist li a {position:relative; display:block; padding:13px 20px; font-weight:400; border-bottom:1px solid #e6e6e6; color:#323232}
#sidemenu .snblist li:last-child a{border-bottom:0px;}
#sidemenu .snblist li a[target='_blank']:after {font-family:'FontAwesome'; font-size:11px; display:inline-block; content:"\f08e"; margin:0 0 2px 5px; vertical-align:middle;}
#sidemenu .snblist li a:hover {text-indent:5px;
	-webkit-transition:all 0.3s ease;
	-moz-transition:all 0.3s ease; color:#303030; transition:0.3s}
#sidemenu .snblist li.active a {color:#d10000; font-weight:600}
#sidemenu .snblist li a i:after,#sidemenu .snblist li.active a i:after {
	position:absolute;
	top:16px;
	font-weight:bold;
	right:10px;
	-webkit-transition:all 0.3s ease;
	-moz-transition:all 0.3s ease;
	transition:all 0.3s ease;
	font-family:FontAwesome;
	content:"\f105";
	font-style:normal;
	color:#808080
}
#sidemenu .snblist li a:hover i:after{right:7px;}
#sidemenu .snblist li.active a i:after{color:#d10000}
#sidemenu .snblist li.active a:hover i:after{right:7px;}


#sidemenu .snblist li a i:after {background:rgba(255,255,255,0)}

#sidemenu .snblist li a:hover i:after {
	-webkit-transform:translateY(-50%) translateX(20%);
	-moz-transform:translateY(-50%) translateX(20%);
	-ms-transform:translateY(-50%) translateX(20%);
	-o-transform:translateY(-50%) translateX(20%);
	transform:translateY(0) translateX(20%);
	color:#fff;
	background:rgba(255, 255, 255, 1);
}

#sidemenu .snblist li.select a:hover i:after {
	-webkit-transform:none;
	-moz-transform:none;
	-ms-transform:none;
	-o-transform:none;
	transform:none;
	color:#fff;
	background:rgba(255, 255, 255, 1);
}


#fl_menu{display:none;}
.con{position:relative; min-height:500px;}
.conh3{font-size:1.5em; font-weight:800; color:#000000; text-align:left; padding-bottom:20px; margin-bottom:40px; border-bottom:3px solid #dee0e5; position:relative; display:flex; flex-wrap:wrap; align-items:flex-end;}
.conh3 small {font-weight:500; width:100%; font-size:16px;}
.conh3 .myedu {margin-left:auto;}
.conh3 .myedu a {font-size:16px; font-weight:400; background:url('../img/ic_myedu.png') no-repeat center left / 20px; padding-left:25px;}
.conh3 br {display: none;}

.path{display:block;}
.path li{font-size:12px; display:inline-block; vertical-align:top;}
.path li:before{content:'\f105'; font-family:'FontAwesome'; display:inline-block; padding:0px 10px}
.path li:first-child:before{display:none;}

.subwrap {position:relative; /*z-index:999;*/}

@media all and (min-width:768px) {
	#sub{padding:50px 0px 0px}
	.conh3{font-size:1.75em}

	#twodepthNav {position:relative; display:block;}
}

@media all and (min-width:1200px) {
	.subwrap{margin:0 auto;}
	.sub_tab{display:block;background:#0788c7; padding:10px 0px; text-align:right; color:#ffffff; font-size:0.85em; text-align:right;}
	.sub_tab h3, .sub_tab p{display:inline-block; margin-left:15px; color:#fbdf40; font-weight:bold}
	.sub_tab h3{color:#ffffff}
	.sub_tab h3 span{margin-right:10px; text-transform:uppercase; color:#fbdf40}
	.sub_tab p {border-radius:50px; background:#462e16; padding:5px 10px;}

	#twodepthNav ul.li02 li{width:25%;}

	#sub{position:relative; width:100%; margin:0 auto 80px; min-height:650px; padding:40px 0px 0px}
	.con{width:1160px; margin:0 auto; min-height:800px;}
}

@media all and (min-width:1640px) {
	#sidemenu{display:block}
	#fl_menu{display:block; position:absolute; right:20px; z-index:9999; width:125px; top:0px; height:600px}
	#fl_menu .label{text-align:center; line-height:80px; font-size:18px; font-weight:bold; background:#29343f; color:#fff;}
	#fl_menu ul {text-align:center; padding:10px 0px 30px; background:#ffffff}
	#fl_menu ul li a{font-size:16px; font-weight:600; padding:8px 0px}
	#fl_menu ul li span{display:block}
	#fl_menu .menu{display:block; border:1px solid #dcdcdc}
	#fl_menu .menu img{max-width:60px}
	#fl_menu .menu .menu_item{display:block; background:#ffffff; color:#323232; }
}


/*컬러패스
#sub_drop{position:relative; background:#e7211a;  font-size:0.9em}
#sub_drop .home a{display:block; line-height:45px; padding:0 20px; border-left:1px solid #dcdcdc; border-color:rgba(255,255,255,0.2);}
#sub_drop .home{min-width:46px !Important}
#sub_drop .home img{display:inline-block; vertical-align:middle}
#sub_drop .dropdown{float:left; border-right:1px solid #dcdcdc;border-color:rgba(255,255,255,0.2); position:relative;}
#sub_drop .dropdown.deph02{min-width:35%}
#sub_drop .dropbtn {background:#e7211a;  width:100%; text-align:left; display:inline-block; height:auto; position:relative; line-height:45px; padding:0 25px 0 10px; cursor:pointer; color:#ffffff;}
#sub_drop .dropbtn:after{font-family:'FontAwesome'; content:'\f107'; position:absolute; right:10px; color:#ffffff; font-size:14px; top:0; bottom:0; margin:auto;}

#sub_drop .dropdown ul{}
#sub_drop .dropdown ul li{padding:5px 10px; }
#sub_drop .dropmenu {display:none;  position:absolute;  z-index:5; background:#ffffff; border:1px solid #dcdcdc; box-sizing:content-box; left:-1px; width:100%;}
#sub_drop .dropmenu a{display:block; line-height:30px; color:#000000; }
#sub_drop .dropmenu a:hover {color:#e7211a; font-weight:600;}
#sub_drop .dropdown .show {display:block;}

#sub_drop:after{display:block; content:''; clear:both;}

@media all and (min-width:768px) {
	#sub_drop .dropbtn{padding:0 25px 0 20px}
	#sub_drop .dropdown ul li{padding:5px 20px; }
	#sub_drop .dropdown{min-width:200px}
	#sub_drop .dropdown.deph02{min-width:200px}
	#sub_drop .dropmenu a{line-height:40px;}
	#sub_drop .home a{line-height:60px;}
	#sub_drop .dropbtn {line-height:60px}
	#sub_drop .dropbtn:after{right:15px}
}

/*흰색패스*/
#sub_drop{position:relative; border-width:1px 0px; z-index:1;}
#sub_drop .home a{display:block; line-height:45px; padding:0 20px;}
#sub_drop .home{min-width:46px !important;}
#sub_drop .home img{display:inline-block; vertical-align:middle}
#sub_drop .dropdown{float:left; position:relative; z-index:101}
#sub_drop .dropdown.deph02{min-width:20%}
#sub_drop .dropdown.deph03{min-width:30%}
#sub_drop .dropdown.deph04{min-width:35%}
#sub_drop .dropbtn {background:#ffffff;  width:100%; text-align:left; display:inline-block; height:auto; position:relative; line-height:45px; padding:0 25px 0 10px; cursor:pointer; color:#000000; font-size:14px;}
#sub_drop .dropbtn:after{font-family:'FontAwesome'; content:'\f107'; position:absolute; right:10px; color:#000000; font-size:14px; top:0; bottom:0; margin:auto;}

#sub_drop .dropdown ul{}
#sub_drop .dropdown ul li{padding:5px 10px; }
#sub_drop .dropmenu {display:none;  position:absolute;  z-index:5; background:#ffffff; -webkit-box-shadow:0px 5px 10px 0px rgb(0 0 0 / 5%); box-shadow:0px 5px 10px 0px rgb(0 0 0 / 5%); box-sizing:content-box; left:-1px; width:100%;}
#sub_drop .dropmenu a{display:block; line-height:30px; color:#000000; font-size:14px;}
#sub_drop .dropmenu a:hover {color:#3f434e; font-weight:800;}
#sub_drop .dropdown .show {display:block;}

#sub_drop:after{display:block; content:''; clear:both;}

@media all and (min-width:768px) {
	#sub_drop .dropbtn{padding:0 25px 0 20px; font-size:16px;}
	#sub_drop .dropdown ul li{padding:5px 20px; }
	#sub_drop .dropdown{min-width:200px}
	#sub_drop .dropdown.deph02{min-width:200px}
	#sub_drop .dropdown.deph03{min-width:250px}
	#sub_drop .dropdown.deph04{min-width:250px}
	#sub_drop .dropmenu li{border-bottom:1px dotted #e0e0e0;}
	#sub_drop .dropmenu li:last-child{border-bottom:0;}
	#sub_drop .dropmenu a{line-height:auto; font-size:16px;}
	#sub_drop .home a{line-height:60px;}
	#sub_drop .dropbtn {line-height:60px}
	#sub_drop .dropbtn:after{right:15px}
}

#sub_drop .list {display:none;}

@media all and (min-width:1400px) {
	#sub_drop.inner,
	#sub .inner {max-width:1360px;}
	#sub .inner {padding-left:240px;}
	#sub_drop .list {position:absolute; width:220px; display:block;}
	#sub_drop .list .list_tit {text-align:center; padding:55px 0 0; height:160px; background:#606678; color:#fff;}
	#sub_drop .list .list_tit .eng {font-size:0.6em; opacity:0.6;}
	#sub_drop .list .list_tit .kor {font-size:1.25em; font-weight:800; margin-top:10px;}
	#sub_drop .list li {border:1px solid #e0e0e0; margin:10px 0 0;}
	#sub_drop .list li.active,
	#sub_drop .list li.active:hover {background:#3f434e; color:#fff; border-color:#3f434e; font-weight:800;}
	#sub_drop .list li a {padding:10px 15px; font-size:1em;/* line-height:48px; */display:inline-block;width:100%;transition:0.2s;}
	#sub_drop .list li:hover {background:#fafafa; font-weight:800;}
	#sub_drop .list dl {border:1px solid #e0e0e0; border-top:0; padding:10px 0; background:#fafafa;}
	#sub_drop .list dd a {padding:0 20px; font-size:0.9em; line-height:30px;}
	#sub_drop .list dd.active a {color:#3f434e; font-weight:800;}
	#sub_drop .home a{margin-left:220px;}
}

@media all and (max-width:1200px) {
	#layerPopup0{top:100px !Important; left:0 !Important;}
	#layerPopup1{top:435px !Important; left:0 !Important;}
	#layerPopup2{top:770px !Important; left:0 !Important;}
	#layerPopup3{top:1105px !Important; left:0 !Important;}
	#layerPopup4{top:1440px !Important; left:0 !Important;}
	#layerPopup5{top:1775px !Important; left:0 !Important;}
}

.education_li{position:relative; margin-bottom:20px}
.education_li ul:after{content:''; display:block; clear:both;}
.education_li ul li{width:48.5%; float:left; position:relative; margin-bottom:10px; background:#ffffff;
background:#ffffff; margin-bottom:10px;
-webkit-box-shadow: 0px 0px 20px -5px rgba(0,0,0,0.2);
-moz-box-shadow: 0px 0px 20px -5px rgba(0,0,0,0.2);
box-shadow: 0px 0px 20px -5px rgba(0,0,0,0.2);}
.education_li ul li .select_btn{position:absolute; right:5px; top:5px; z-index:5; display:block; width:40px; height:40px; }
.education_li ul li .select_btn input{width:100%; height:100%;}
.education_li ul li:nth-child(odd){margin-right:3%;}

.education_li .photo {position:relative}
.education_li .movie:before{content:''; width:100%; height:100%; position:absolute; left:0; top:0; bottom:0; right:0; background:rgba(0,0,0,0.3); z-index:1;}
.education_li .movie:after{content:''; width:40px; height:40px; position:absolute; left:0; top:0; bottom:0; right:0; margin:auto; background:url(../img/ic_play.png) no-repeat center center; background-size:100% !Important; z-index:2; opacity:0.9}

.education_li .photo img{width:100%}
.education_li .photo span.cate{position:absolute; top:5px; left:5px; display:inline-block; font-size:11px; color:#ffffff; padding:2px 4px; background:#505050; margin-bottom:5px; }
.education_li .photo span.colum01{background:#ed2c13}/*1*/
.education_li .photo span.colum02{background:#60b85d}/*2*/
.education_li .photo span.colum03{background:#23b8bc}/*3*/
.education_li .photo span.colum04{background:#003e75}/*4*/
.education_li .photo span.colum05{background:#577789}/*5*/

.education_li .txt{padding:10px 10px; }
.education_li .txt dt span.tit{display:block; display:-webkit-box;
-webkit-line-clamp: 2; /* 라인수 */
-webkit-box-orient: vertical;
word-wrap:break-word;
line-height: 1.3;
height: 2.6em;
overflow:hidden;
text-overflow:ellipsis;
white-space:normal;
word-break:break-all;
font-weight:500; }
.education_li .txt dt{margin-bottom:5px;}
.education_li .txt dd.date{font-size:0.9em; color:#808080; text-align:right}


.education_li2 .photo{position:relative; overflow:hidden; padding-bottom:62%;}
.education_li2 .photo img{position:absolute; width:100% !important; top:0; }


@media all and (min-width:860px) {
.education_li ul li{width:24.25%; margin-right:1% !important; margin-bottom:20px}
.education_li ul li:nth-child(4n){margin-right:0 !important}
}


@media all and (min-width:1024px) {

.education_li {margin-bottom:40px}
.education_li .txt{padding:20px 15px}

.education_li .txt dt span.cate{font-size:13px}

.education_li ul li{position:relative}
.education_li ul li:after, .education_li ul li:before,
.education_li ul li dt:after, .education_li ul li dt:before{
  width: 4px;
  height: 0;
  position: absolute;
  display: block;
  content: "";
  background-color: #9da2b1;
  transition:all 0.2s cubic-bezier(.25,.25,.53,.94);
  z-index:1;
}

.education_li ul li:after{width:0px; height:4px;}
.education_li ul li dt:after{width:0px; height:4px;}

.education_li ul li:before{width:4px; height:0px;}
.education_li ul li dt:before{width:4px; height:0px;}

.education_li ul li:after{left:0; top:0}
.education_li ul li:before{left:0; bottom:0}

.education_li ul li dt:after{right:0; bottom:0}
.education_li ul li dt:before{right:0; top:0; }
.education_li ul li:hover:after{width:100%}
.education_li ul li:hover:before{height:100%;}
.education_li ul li:hover dt:after{width:100%}
.education_li ul li:hover dt:before{height:100%;}
}


@media all and (min-width:1200px) {
.education_li .photo span.cate{padding:5px 12px; left:-3px; top:-3px; font-size:0.85em; z-index:10}
.education_li .movie:after{width:60px; height:60px}
}



.agree_box p{margin-bottom:20px;}
.agree_flex{display:flex; gap:0.5%; flex-wrap:wrap;}
.agree_flex .box{width:49%;}
.agree_flex .box label{border: 1px solid #6a7285;color: #6a7285;padding: 7px;display: flex;align-items: center;justify-content: center;font-weight: 500;margin: 0 0.5% 10px;text-align: center;line-height: 1.2;}
.agree_flex .box input[type="radio"] {display:none;}
.agree_flex .box label:before {font-family:FontAwesome; content:'\f058'; font-size:1.25em; margin:0 0.2em 0 0; opacity:0.3;}
.agree_flex .box input[type="radio"]:checked + label {background:#606678; color:#fff;}
.agree_flex .box input[type="radio"]:checked + label:before {opacity:1;}

@media all and (min-width:768px) {
.agree_flex .box{width:32.33%;}
}

@media all and (min-width:1200px) {
.agree_flex .box{width:19%;}
}


/* 고정형 영상정보처리기기 운영관리방침 */
table{width:100%;border-collapse:collapse;border-top:2px solid #888888;margin-bottom:30px;	font-size:16px;}
caption{position:absolute;	width:1px;	height:1px;	overflow:hidden;clip:rect(0 0 0 0);}
th,
td{border:1px solid #ddd; padding:8px 8px;text-align:center;vertical-align:middle;}
table tr > *:first-child{border-left:none;}
table tr > *:last-child{border-right:none;}
thead th{	background:#f8f8f8;	font-weight:700;}
.tbl_cctv td:last-child{text-align: center;}
.tbl_policy td[colspan="2"]{text-align:left;}
.total td{font-weight:700;	background:#fafafa;}
.org_name .br_pc {
	display: none;
}
.col_installplace{width:10%;}
.col_floor{width:10%;}
.col_count{width:10%;}
.col_range{width:auto;}


.col_type{width:25%;}
.col_dept{width:25%;}
.col_rank{width:25%;}
.col_tel{width:25%;}

.col_time{width:33.333%;}
.col_place{width:33.333%;}
.col_keep{width:33.333%;}


@media all and (min-width:380px) {
td{/* border:1px solid #ddd; */padding:10px 12px;}
.col_installplace{width:13.33%;}
.col_floor{width:13.33%;}
.col_count{width:13.33%;}
.col_range{width:60%;}
}

@media all and (min-width:780px) {
.org_name .br_pc {
	display: block;
}
.org_name .br_m {
	display: none;
}
}


@media all and (min-width:980px) {
.col_installplace{width:16.66%;}
.col_floor{width:16.66%;}
.col_count{width:16.66%;}
.col_range{width:50%;}
}


.new_btn_box{
    background: #f8f8f8;
    padding: 20px;
    display: flex;
    justify-content: center;
}
.new_btn_box a{
    background: #40434d;
    color: #fff;
    height: 140px;
    height: 40px;
    width: 140px;
    display: block;
    text-align: center;
    line-height: 40px;
}