header.scroll{background:rgba(var(--secondary-rgb),.9)}
#openform{background:rgba(var(--white-rgb),.3)}
section{padding:6vw 0 5vw}
section.section_pad{padding:5vw 0}
@keyframes floatUpDown{0%{transform:translateY(0)}
50%{transform:translateY(-15px)}
100%{transform:translateY(0)}
}
section>*{z-index:3}
section .title_box{margin-bottom:11px;padding-bottom:10px}
section .title_box:before{content:"";position:absolute;width:80vw;height:1px;background:rgb(155 155 155 / 55%);bottom:0;margin-left:-38%;z-index:0}
section .title_box .area_title{font-weight:500;font-size:max(4.2 * (1vw + 1vh) / 2,28px);color:#242424}
section .submtext p{font-size:max(1.5 * (1vw + 1vh) / 2,18px);color:#717171}
section#about_area article p{font-size:max(1.3*(1vw + 1vh) / 2,14px);color:#717171;font-weight:400;line-height:222%}
section#about_area article{margin-top:80px;margin-bottom:80px}
section .title_box .sub_title{font-weight:500;font-size:max(1.5 * (1vw + 1vh) / 2,14px);color:#717171;line-height:100%;text-transform:uppercase}
#photo_list img{animation:floatUpDown 3s infinite}
#photo_list:before{content:"";position:absolute;width:80%;height:92%;background:#e2e2e2;bottom:-7%;left:-9%;border-radius:0 0 0 60px}
section .title_box2{display:flex;flex-direction:column;align-items:center}
section .title_box2 .sub_title{font-weight:500;font-size:max(3.3 * (1vw + 1vh) / 2,29px);color:#fff;line-height:100%;display:flex;flex-direction:column;align-items:center}
section .title_box2 .sub_title:before{position:absolute;content:"";width:300px;margin-top:15px;aspect-ratio:4/2;background:url(/images/40/panban.png);background-size:contain;background-repeat:no-repeat;background-position:50%;z-index:-1}
section .title_box2 .area_title{position:absolute;top:-65px;font-weight:500;font-size:max(6.8 * (1vw + 1vh) / 2,24px);color:rgb(255 255 255 / 15%);z-index:-1;letter-spacing:.35em;text-transform:uppercase}
section#post_box .title_box .sub_title{color:#00021c}
section#post_box .title_box .area_title{font-size:max(1.1*(1vw + 1vh) / 2,12px)}
.bg_box{width:100%;height:100%;background:no-repeat 50%/cover;background-attachment:fixed;opacity:.3;top:0;left:0}
.bg_box.white:before{background:rgba(var(--white-rgb),.2)}
.mootsoganbox{display:flex;flex-direction:column;align-items:center;padding:50px 0}
.mootsoganbox h5{font-size:max(2.2*(1vw + 1vh) / 2,28px)}
.mootsoganbox p{font-size:max(1.6*(1vw + 1vh) / 2,18px)}
.mootsoganbox img{margin-top:10px}
#poodutbox .tamaskimg{position:absolute;bottom:0;display:flex;width:100%}
#poodutbox .maatoobox .tamaskimg a{display:flex;width:100%;flex-direction:row;align-items:center;color:#fff;padding:20px;justify-content:flex-end}
#poodutbox .maatoobox .tamaskimg a img{width:22px;margin-right:5px}
#poodutbox .maatoobox{margin:0 10px;position:relative}
#poodutbox .maatoobox a{display:flex;flex-direction:column;align-items:center;background-size:100%}
#poodutbox .maatoobox a:hover{background-size:120%}
#poodutbox .maatoobox a img{width:100%}
#sotalkbox{position:relative;background:url(/images/40/sogoanJ_bg.jpg);padding:50px 0 0;background-size:cover}
#sotalkbox .teenJbox{display:grid;grid-template-rows:repeat(1,1fr);grid-template-columns:59% 39%;padding:0;gap:2%}
.sotitle *{color:#fff}
.sotitle h5{font-size:max(2.2*(1vw + 1vh) / 2,28px)}
.sotitle{margin-bottom:50px;margin-left:40px;margin-top:40px}
.sotitle p{font-size:max(1.2*(1vw + 1vh) / 2,20px)}
#sotalkbox .info{overflow:hidden;margin:10px 0 10px;height:328px;width:min(471px ,100%);background-image:url(/images/40/img-aboutBox.png);background-repeat:no-repeat;background-size:98%}
#sotalkbox .info article{overflow-y:scroll;padding:7% 16% 7% 16%;font-size:14px;line-height:200%;color:#575757;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:9;-webkit-box-orient:vertical}
#sotalkbox .info article::-webkit-scrollbar{width:5px}
#sotalkbox .info article::-webkit-scrollbar-track{background:rgba(#989898 .4)}
#sotalkbox .info article::-webkit-scrollbar-thumb{background:#f5f5f5}
#about_area .info_box article,#about_area2 .info_box article{width:90%;line-height:210%;letter-spacing:1.5px;font-weight:300}
#about_area{background:#f9fafe;z-index:1}
.flypanme{position:absolute;right:7%;margin-top:-54px;z-index:987}
.flypanme img{object-fit:cover}
#about_area .img_box{z-index:2}
#about_area .info_box,#about_area2 .info_box{padding:20px;display:flex;flex-direction:column}
#about_area .workframe,#about_area2 .workframe{display:flex;justify-content:space-between;align-items:center;z-index:988}
#about_area .workframe:before{content:"";position:absolute;width:1px;height:134%;background:#c7c7c7;right:0;top:-115px;z-index:0}
#about_area:before{content:"";position:absolute;width:129%;height:1280px;background:url(/images/40/Jabg.png);top:-28%;left:-10%}
#about_area:after{content:"";position:absolute;width:129%;height:1280px;top:-28%;left:-10%;background:#fafafa;z-index:-1}
#about_area2{margin-top:100px}
a.boomlink{display:flex;align-items:center;padding:8px 9px;width:180px;box-sizing:border-box;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;background:rgb(255 255 255 / 20%);justify-content:space-around;border-radius:50px;color:#4a4a4a;letter-spacing:.15em;font-size:max(1.1 * (1vw + 1vh) / 2,14px);transition:all .3s ease-in-out;-webkit-transition:all .3s ease-in-out;border:#acacac 1px solid;margin-top:30px}
a.boomlink:hover{background:var(--primary);border:var(--primary) 1px solid}
a.boomlink:hover span{color:#fff}
a.boomlink span{color:#3d3d3d;font-size:max(1.1*(1vw + 1vh) / 2,14px)}
a.boomlink:hover svg{-moz-transform:rotate(3deg);-webkit-transform:rotate(3deg);-o-transform:rotate(3deg);-ms-transform:rotate(3deg);transform:rotate(90deg);border-radius:50%;fill:var(--primary);background:#fff}
a.boomlink svg{width:16px;aspect-ratio:1/1;margin-left:10px;fill:#fff;-moz-transform:rotate(3deg);-webkit-transform:rotate(3deg);-o-transform:rotate(3deg);-ms-transform:rotate(3deg);transform:rotate(90deg);transition:all 0s ease-in-out;-webkit-transition:all 0s ease-in-out;background:var(--primary);border-radius:50%;padding:8px}
.mapotext{display:flex;background:#1c5890;padding:15px 0}
.mapotext .workframe{display:flex;align-items:center}
.mapotext .workframe img{width:38px}
.mapotext .workframe span{width:2px;height:20px;background:rgb(255 255 255 / 64%);margin:0 25px}
.mapotext .workframe p{color:#fff;font-weight:300;letter-spacing:.05em}
#post_box{background-image:url(/images/40/gas_bg.jpg)}
#post_box .Jlinkbum ul{display:flex;justify-content:space-between}
#post_box .Jlinkbum ul li{display:flex;flex-direction:column;width:49%;position:relative}
#post_box .Jlinkbum ul li:hover a.boomlink svg{-moz-transform:rotate(3deg);-webkit-transform:rotate(3deg);-o-transform:rotate(3deg);-ms-transform:rotate(3deg);transform:rotate(90deg);border-radius:50%}
#post_box .Jlinkbum ul li:hover img{-moz-transform:scale(.8);-webkit-transform:scale(.8);-o-transform:scale(.8);-ms-transform:scale(.8);transform:scale(1.2)}
#post_box .Jlinkbum ul li *{box-sizing:border-box;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;color:#fff}
#post_box .Jlinkbum ul li .Jboitem{overflow:hidden;border-radius:20px}
#post_box .Jlinkbum ul li a.ufolink{position:absolute;width:100%;height:100%;z-index:6}
#post_box .Jlinkbum ul li .Jboitem:before{content:"";position:absolute;width:100%;height:100%;background-image:linear-gradient(to bottom,rgb(0 0 0 / 0),rgb(0 0 0 / 83%));border-radius:20px;z-index:2}
#post_box a.boomlink{background-image:unset;border:#fff 1px solid}
#post_box .Jlinkbum ul li .Jbinfo{position:absolute;bottom:0;display:flex;width:100%;flex-direction:column;padding:18px 25px;z-index:3}
#post_box .Jlinkbum ul li .Jbinfo .topJb{display:flex;justify-content:flex-end}
#post_box .Jlinkbum ul li .Jbinfo .topJb p{color:#fff;width:85%;display:flex;align-items:center}
#post_box .Jlinkbum ul li .Jbinfo .topJb p:before{content:"";position:absolute;width:10%;height:1px;background:#fff;left:4%}
#post_box .Jlinkbum ul li .Jbinfo .textJb{display:flex;align-items:center;justify-content:space-between}
#post_box .Jlinkbum ul li .Jbinfo .textJb p{font-size:max(2.2 * (1vw + 1vh) / 2,27px);color:#fff}
#art_box{background-image:url(/images/40/sogon_bg.jpg);background-attachment:fixed;padding:10vw 0 4vw;display:flex;flex-direction:column;align-items:center}
#art_box .workframe{display:flex;flex-direction:column;align-items:center}
#art_box:before{content:"";position:absolute;width:42px;aspect-ratio:1/1;background:#fdfdfd;border-radius:50%;top:-27px}
#art_box .art_textbox{display:flex;flex-direction:column;align-items:center;margin-top:222px}
#art_box .art_textbox *{color:#fff}
#art_box .art_textbox h3{font-size:max(1.4*(1vw + 1vh) / 2,16px)}
#art_box .art_textbox p{font-size:max(1.1*(1vw + 1vh) / 2,16px);font-weight:300}
#newsBox{position:relative;padding:100px 0 100px;display:flex;justify-content:space-between;flex-direction:column;align-items:center;overflow:hidden}
#newsBox .workframe{padding:25px 20px 20px 100px;display:flex;align-items:center}
#newsBox .workframe .JJtitle{width:47%;display:flex;flex-direction:column;margin-top:29px}
.JJtitle h2{font-size:max(2.2*(1vw + 1vh) / 2,28px)}
.JJtitle p{font-size:max(1.2*(1vw + 1vh) / 2,18px)}
#newsBox:before{content:"";width:35%;height:102%;aspect-ratio:1/1;position:absolute;background:rgb(244 244 244);left:0;top:0;border-radius:0;z-index:0;-moz-transform:rotate(0rad);-webkit-transform:rotate(0rad);-o-transform:rotate(0rad);-ms-transform:rotate(0rad);transform:rotate(0rad)}
#newsBox .bg{position:relative;order:2;opacity:1;background-size:cover;border-radius:0 0 0 250px;background-position:50%}
#newsBox .info{padding:0 0;margin-bottom:20px;margin-top:30px;display:flex;width:46%}
#mid-video:after{content:"";position:absolute;width:160px;aspect-ratio:160/140;background:url(/images/40/conitem-2.png);background-position:50%;background-repeat:no-repeat;right:14%;top:60px;transform-origin:right bottom;animation:bounce 2s infinite;background-size:contain}
#newsBox .info .tit{width:5em}
#newsBox .info .tit a{color:#000}
#newsBox .info .news_list{width:100%}
#newsBox .info .news_list .slick-list{padding-bottom:15px}
#newsBox .info .news_list li{position:relative;display:grid;grid-template-columns:144px 1fr 40px;padding:5px 3px;border-top:1px dashed #adadad;align-items:center;box-sizing:border-box;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;transition:all .3s ease-in-out;-webkit-transition:all .3s ease-in-out;margin-bottom:5px}
#newsBox .info .news_list li:hover{background:#fff}
#newsBox .info .news_list li.slick-current{border-top:unset}
#newsBox .info .news_list li a{position:absolute;width:100%;height:100%;left:0;z-index:2;top:0}
#newsBox .news_list li .date{border-right:1px solid #8a8a8a;margin-right:40px;display:flex;align-items:center;justify-content:flex-start;margin-left:5px}
#newsBox .news_list li .time{color:#505050;display:flex;flex-direction:column;align-items:center;font-family:"Nunito Sans",sans-serif;font-size:max(1 * (1vw + 1vh) / 2,14px);font-weight:300;line-height:100%}
#newsBox .news_list li .time b{color:#505050;font-size:max(3.3 * (1vw + 1vh) / 2,39px);font-family:"Nunito Sans",sans-serif;line-height:1}
#newsBox .info .news_list .news_txt{position:relative;width:95%}
#newsBox .info .news_list .fas{aspect-ratio:1/1;background:#1f3349;display:flex;flex-direction:column;align-items:center;justify-content:center;width:30px;color:#fff;border-radius:500px;font-size:12px}
#newsBox .info .news_list .news_txt .mmtop{display:flex;align-items:center;margin-bottom:0}
#newsBox .info .news_list .golink{display:flex;position:absolute;right:2%;bottom:45px}
#newsBox .info .news_list .golink a{position:relative;padding:10px;background:var(--secondary);display:flex;flex-direction:column;align-items:center;justify-content:center;aspect-ratio:1/1;border-radius:50px}
#newsBox .info .news_list .golink a svg{width:22px;fill:#fff}
#newsBox .info .news_list .news_txt span{display:inline-block;background:#f2f2f2;font-size:max(1 * (1vw + 1vh) / 2,13px);padding:7px 9px;width:111px;text-align:center}
#newsBox .info .news_list .news_txt h3{height:auto;font-size:max(1.13 * (1vw + 1vh) / 2,16px);font-weight:600;margin:10px 0;margin-left:10px;text-align:left;text-overflow:ellipsis;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:1;overflow:hidden;width:calc(100% - 20px);color:#1f3349}
#newsBox .info .news_list .news_txt p{-webkit-line-clamp:2;height:53px;font-size:16px;color:#343333;overflow:hidden;margin:10px 0;text-align:left;text-overflow:ellipsis;display:-webkit-box;-webkit-box-orient:vertical}
#newsBox .info .news_list .noBox{position:absolute;width:2em;text-align:center;top:50%;right:-6em;-webkit-transform:translateY(-47%);transform:translateY(-47%)}
#newsBox .bttn{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;margin-top:30px}
#newsBox .info .news_btn{position:relative;width:9em;display:flex;justify-content:space-between;align-items:center;z-index:5}
#newsBox .info .news_btn font{width:5.5em;display:flex;justify-content:flex-end}
#newsBox .info .news_btn font span{min-width:2em;text-align:center}
#newsBox .info .news_btn font span:nth-child(2){min-width:1.5em}
#newsBox .info .news_btn #prevBtn{-webkit-transform:scaleX(-1);transform:scaleX(-1)}
#newsBox .arrow_btns_box a{width:45px;height:45px;background:#509930;border-radius:50px;display:inline-flex!important;align-items:center;justify-content:center;margin:0 5px}
#newsBox .arrow_btns_box a svg{width:17px;height:17px;fill:#fff}
#newsBox .arrow_btns_box a.prev svg{transform:scaleX(-1)}
#damJ{width:100%;padding-top:100px}
#damJ:before{content:"";position:absolute;width:100%;height:250px;background:url(/images/40/coo_bg.jpg);bottom:0}
#damJ .inboconet{position:relative;display:flex;justify-content:space-around;box-shadow:0 5px 13px 3px #3d3d3d73;width:min(993px ,90%);margin:0 auto;padding:80px 0;border-radius:40px;align-items:center;z-index:0;background-color:#fff}
#damJ .inboconet:before{content:"";position:absolute;width:2px;height:75px;background:#1f3349}
#damJ .inboconet a{display:flex;flex-direction:column;align-items:center}
#damJ .inboconet a *{color:var(--primary);font-size:max(1.7*(1vw + 1vh) / 2,21px)}
@-webkit-keyframes spineer{0%{-webkit-box-shadow:0 0 0 0 var(--info)}
70%{-webkit-box-shadow:0 0 0 20px transparent}
100%{-webkit-box-shadow:0 0 0 0 transparent}
}
@keyframes spineer{0%{box-shadow:0 0 0 0 var(--info)}
70%{box-shadow:0 0 0 20px transparent}
100%{box-shadow:0 0 0 0 transparent}
}


@media screen and (min-width: 1281px) {
	#book_area .list_box li:hover .badge {background: var(--primary);color: var(--white);}
	#custom_box li:hover .row {box-shadow: 0 4px 17px 0 rgba(var(--black-rgb), .2);}
}

@media screen and (max-width: 1470px) {
	a.boomlink{padding:5px 9px}
	a.boomlink svg{width:15px}
	.flypanme{width:min(920px,90%);margin-top:-71px}
	#about_area:after,#about_area:before{top:-19%}
	section#news_area:before{width:600px}
	#news_area .bg_box:before{margin-top:100px;height:51%}
	section#news_area{padding-top:155px}
	#news_area .list_box img{height:370px}
	#news_area .list_box .info_box{height:56px;border-radius:0 0 20px 20px}
	#news_area .omgnw_list .list_box:before{width:10vw}
	#news_area .omgnw_list{margin-bottom:60px}
}

@media screen and (max-width: 1280px) {
	#sotalkbox .teenJbox{display:flex;flex-direction:column}
	#sotalkbox .teenJbox .teenleftbox{order:2}
	#sotalkbox .teenJbox .teenrightbox{order:1}
	#sotalkbox:before{content:"";width:100%;height:100%;position:absolute;background:#174b82e3;top:0}
}

@media screen and (max-width: 1024px) {
	section#news_area:before{width:400px}
	#about_area .workframe{display:flex;flex-direction:column}
	#about_area .img_box{margin-bottom:66px}
	#about_area:before{display:none}
	#about_area:after{background-image:linear-gradient(to bottom,#fbfbfb,#f9fafe)}
	#newsBox .workframe{display:flex;flex-direction:column;padding:10px}
	#newsBox .workframe .JJtitle{width:100%}
	#newsBox .info{width:100%}
	#newsBox:before{width:53%}

}

@media screen and (max-width: 980px) {
	#photo_list,#photo_list .pos_rel{display:flex;flex-direction:column;align-items:center}
	#photo_list img{width:min(400px,90%)}
	#photo_list:before{width:70%;left:2%}
	#about_area .workframe,#about_area2 .workframe{display:flex;flex-direction:column}
	#about_area .workframe .img_box,#about_area2 .workframe .img_box{margin:25px 0}
	#about_area2{margin-top:40px}
	#post_box .Jlinkbum ul{display:flex;flex-direction:column;align-items:center}
	#post_box .Jlinkbum ul li{width:100%;margin-bottom:20px}
}

@media screen and (max-width: 768px) {
	#news_area .list_box .info_box{padding:15px 13px;height:70px}
	#youtube_box{padding-bottom:60vw}
	#custom_box li .row{margin:10px 15px;padding:10px 0}
	#about_area2{margin-top:10px}
}

@media screen and (max-width: 640px) {
	section{padding:3vw 0 2vw}
	section .title_box{margin-top:20px}
	#about_area{background:#fff}
	#about_area .info_box article,#about_area2 .info_box article{width:100%;margin-top:39px;margin-bottom:20px}
	#book_area .list_box img{height:65vw}
	#post_box a.boomlink{border:none;width:auto}
	#post_box a.boomlink span{display:none}
	#post_box .Jlinkbum ul li .Jbinfo{padding:15px 15px}
	section .title_box2 .sub_title:before{width:137px}
	#damJ{position:relative}
	#damJ .inboconet{display:flex;flex-direction:column;padding:10px 0}
	#damJ .inboconet:before{width:50%;height:1px}
	#damJ .inboconet a{padding:50px 0}
	#damJ:before{height:100%;background-size:cover;bottom:-40px;display:none}
	#damJ{padding-bottom:80px;position:relative;padding-top:90px;background:url(/images/40/coo_bg.jpg)}
	#poodutbox .maatoobox a.photo img{height:400px}
}

@media screen and (max-width: 480px) {
	footer #flogo #about_area:after{display:none}
	#photo_list:before{width:80%;border-radius:0 0 0 31px}
	#product_area .bgBox{width:100%;object-fit:cover}
	#about_area2{margin-top:10px}
	#about_area:before{height:120px;bottom:-2%}
	.mapotext{padding:2px 0}
	a.boomlink svg{width:12px}
	a.boomlink{width:145px;padding:5px 5px}
	.mapotext .workframe img{width:28px}
	#art_box .art_textbox{margin-top:107px}
	#art_box{padding:77px 0 20px}
	section .title_box2 .area_title{top:-18px;font-size:38px}
	#post_box{padding-bottom:35px}
	#about_area .workframe:before{background:#cdcdcd;right:-26px}
	section .title_box:before{width:100vw;right:-29px;margin-left:0}
	.flypanme{margin-top:-14px;width:min(920px,100%)}

}