@charset "utf-8";

.swiper-slide img{width:100%}
#main			{ overflow-x:hidden; }
#main>section{padding:1.5em 1em}
#main>section:not(:has(.infozon)) h2,
.service h2{font-size:1.7em;}
@media (min-width:768px){
    #main>section{padding:3em 1.5em}
}
@media (min-width:1440px){
    #main>section{padding:8em 3em}
    #main>section:not(:has(.infozon)) h2,
    .service h2{font-size:40px;}
}

/* -------------------------- visual -------------------------- */
.visual{background:#dcf0fb;}
.visual .map{background:url(../images/main/map.png) no-repeat center / contain; position:relative; height:100vw; margin-bottom:5em; position:relative;}
.visual .map:has(li:first-child button:hover),
.visual .map:has(li:first-child button:focus),
.visual .map:has(li:first-child button.on){background-image:url(../images/main/map_deokjin.png); transition:all .5s}
.visual .map:has(li:nth-child(2) button:hover),
.visual .map:has(li:nth-child(2) button:focus),
.visual .map:has(li:nth-child(2) button.on){background-image:url(../images/main/map_wansan.png); transition:all .5s}
.visual .map h2{position:absolute; bottom:-3em; right:0; line-height:1.2em; color:#725839; font-family:var(--font-jalnan);}
.visual .map h2:before{content:""; display:block; background:#cacbaf; width:1.5em; height:3px; position:absolute; left:-2em; top:.6em}
.visual .map h2 strong{color:var(--color-brown);}
.visual .map ul{height:100%;}
.visual .map li:first-child{padding-top:26%;}
.visual .map li{height:42%; text-align:center; display:inline-flex; width:100%; justify-content:center; align-items:center; font-weight:600; font-size:1.5em;}
.visual .map button{display:block; color:var(--color-orange); opacity:.8}
.visual .map li:nth-child(2) button{color:#7d9910;}
.visual .map button:hover,
.visual .map button:focus{opacity:1; transition:all .5s;}
.visual .map button:before{content:""; display:block; background:var(--color-orange) url(../images/main/check.png) no-repeat center; border-radius:50%; margin:0 auto .2em auto;}
.visual .map li:nth-child(2) button:before{background-color:#7d9910;}
.visual .map button:hover:before,
.visual .map button:focus:before,
.visual .map button.on:before{width:1.5em; height:1.5em; transition:all .5s}

.visual .search{background:#faf7e3; border-radius:1em; margin-top:6em;}
.visual .search_box{display:flex; flex-wrap:wrap; gap:.5em; padding:1em;}
.visual .search select{border:0; border-radius:.5em; flex:100%; background:#ffffff url(../images/common/arr_brown.png) calc(100% - 1em) center no-repeat;}
.visual .search input{border:0; border-radius:.5em; width:80%}
.visual .search button{background:var(--color-orange); display:block; width:20%; color:#fff; border-radius:.5em}
.visual .search_inp{width:100%; margin-top:1.5em; display:flex; flex-wrap:wrap; justify-content:space-between; background:#fff; border-radius:.5em; position:relative;}
.visual .search_inp:before{content:""; display:block; width:100%; height:1px; background:#f1edd1; position:absolute; top:-1em; left:0;}

.visual .result_tit{background:#fdf0a7 url(../images/main/map.svg) no-repeat 1em center / 75px; text-align:center; padding:1em 0 1em 80px; border-radius:1em 1em 0 0}
.visual .result_tit h3{font-family:var(--font-jalnan); font-size:1.5em; line-height:1.2em; margin-bottom:.3em}
.visual .result_tit span{font-family:var(--font-gong); display:block; font-weight:600}
.visual .result_tit p{font-size:1.1em; font-weight:bold; color:#725839; border:1px solid #fff; border-radius:30px; width:max-content; margin:auto; padding:.2em 1em}
.visual .ii_building{background:url(../images/main/building.png) no-repeat; width:18px; height:18px; margin-right:.5em}

.visual .result_list{background:#fff; border-radius:0 0 1em 1em; padding:1em}
.visual .result_list ul{display:flex; flex-wrap:wrap; text-align:center; height:40vh; overflow-y:auto; overflow-x:hidden; gap:.5em}
.visual .result_list li{flex-grow:1; width:calc(50% - .5em); display:block;}
.visual .result_list a{border:1px solid #ddd; border-radius:1em; padding:.5em; display:block; line-height:1.2}
.visual .result_list [class*="i_"]{height:3em; width:100%; margin:auto;}
.visual .result_list dt{display:block; text-overflow:ellipsis; overflow:hidden; white-space:nowrap; color:#666}
.visual .result_list dd{font-weight:600}
.visual .result_list p{padding-top:.5em; text-align:right}

.visual .i_baby{background:url(../images/main/i_baby.png) no-repeat center;}
.visual .i_children{background:url(../images/main/i_children.png) no-repeat center;}
.visual .i_student{background:url(../images/main/i_student.png) no-repeat center;}
.visual .i_book{background:url(../images/main/i_book.png) no-repeat center;}
.visual .i_together{background:url(../images/main/i_together.png) no-repeat center;}
.visual .i_kindergarden{background:url(../images/main/i_kindergarden.png) no-repeat center;}
.visual .i_tree{background:url(../images/main/i_tree.png) no-repeat center;}
.visual .i_map{background:url(../images/main/i_map.png) no-repeat center;}
.visual .i_newborn{background:url(../images/main/i_newborn.png) no-repeat center;}
.visual .i_star{background:url(../images/main/i_star.png) no-repeat center;}
.visual .i_women{background:url(../images/main/i_women.png) no-repeat center;}
.visual .i_family{background:url(../images/main/i_family.png) no-repeat center;}
.visual .i_hospital{background:url(../images/main/i_hospital.png) no-repeat center;}
.visual .i_heart{background:url(../images/main/i_heart.png) no-repeat center;}
.visual .i_building{background:url(../images/main/i_building.png) no-repeat center;}
.visual .i_food{background:url(../images/main/i_food.png) no-repeat center;}
.visual .i_play{background:url(../images/main/i_play.png) no-repeat center;}
.visual .i_abc{background:url(../images/main/i_abc.png) no-repeat center;}

.visual .i_kindercare{background:url(../images/main/i_kindercare.png) no-repeat center;}
.visual .i_training{background:url(../images/main/i_training.png) no-repeat center  / auto 80%;}
.visual .i_develop{background:url(../images/main/i_develop.png) no-repeat center  / auto 80%;}
.visual .i_activity{background:url(../images/main/i_activity.png) no-repeat center  / auto 80%;}
.visual .i_rehabil{background:url(../images/main/i_rehabil.png) no-repeat center  / auto 80%;}
.visual .i_language{background:url(../images/main/i_language.png) no-repeat center  / auto 80%;}
.visual .i_pharmacy{background:url(../images/main/i_pharmacy.png) no-repeat center  / auto 80%;}
@media (min-width:540px){
    .visual .search_result{display:flex; flex-wrap:wrap; justify-content:space-between;}
    .visual .result_tit{width:12em; background-position:center 4em; border-radius:1em 0 0 1em; padding:10em 0 0 0;}
    .visual .result_list{width:calc(100% - 12em); border-radius:0 1em 1em 0}
}
@media (min-width:768px){
    #main>section.visual{padding-top:2em}
    .visual_wrap{display:flex; justify-content: space-between; align-items:center;}
    
    .visual .map{width:50vw; height:50vw; background-position:0 0; margin-bottom:0;}
    .visual .map h2{bottom:0; right:1em}
    .visual .map li:first-child{padding-top:10vw;}
    .visual .map li{height:21vw;}

    .visual .search{width:50vw; margin-top:0; height:max-content}
    
    .visual .result_tit{width:10em; background-position:center 3em; padding-top:9em;}
    .visual .result_tit p{margin-top:1em}
    .visual .result_list{width:calc(100% - 10em);}
    .visual .result_list ul{height:230px;}
}
@media (min-width:1440px){
    #main>section.visual{padding-bottom:8em; position:relative;}
    .visual:before{content:""; display:block; width:151px; height:262px; background:url(../images/main/bg_dotR.png); position:absolute; top:2em; right:0}
    .visual:after{content:""; display:block; width:273px; height:319px; background:url(../images/main/bg_dotL.png); position:absolute; bottom:8em; left:0}
    .visual_wrap{max-width:1440px; margin:auto; gap:2em; flex-wrap:wrap;}
    .visual .map{width:657px; height:696px; position:relative;}
    .visual .map:before{content:""; display:block; background:url(../images/main/v_boy.png) no-repeat; width:59px; height:69px; position:absolute; top:14em; right:6.5em;  animation:v_boy 2s linear infinite normal forwards;}
    @keyframes v_boy {
        from{transform:translateY(0);}
        50%{transform:translateY(-.5em);}
        to{transform:translateY(0);}
    }
    .visual .map:after{content:""; display:block; background:url(../images/main/v_car.png) no-repeat; width:50px; height:26px; position:absolute; top:22em; left:14.5em;  animation:v_car 8s linear infinite normal forwards;}
    @keyframes v_car {
        10%{transform:rotate(-5deg) translate3d(-10px, 3px, 10px); perspective: none;}
        20%{ transform:rotate(5deg)}
        30%{ transform:rotate(-5deg) translate3d(-10px, -10px, -30px); perspective: 100px;}
        40%{ transform:rotate(5deg);}
        50%{ transform:rotate(-5deg);}
        80%{ transform:rotate(5deg); perspective: 200px;}
    }
    .visual .map>ul:before{content:""; display:block; width:60px; height:274px; background:url(../images/main/kite.svg) no-repeat; position:absolute; top:0; left:5em}
    .visual .map h2{right:-4.5em}
    .visual .map li:first-child{padding-top:130px;}
    .visual .map li{height:300px;}

    .visual .search{max-width:747px; width:calc(100% - 657px - 2em)}
    .visual .search select{flex:auto}
    .visual .search_inp{width:38%; margin-top:0; border-top:0;}

    .visual .result_tit{width:13em; background-size:6.5em}
    .visual .result_tit h3{margin-bottom:1em; padding-top:.2em}
    .visual .result_tit p{padding:.5em 1em; font-size:18px}
    .visual .result_list{width:calc(100% - 13em);}
    .visual .result_list ul{gap:1em; height:270px; padding:.8em 1.2em .8em .8em}
    .visual .result_list li{width:calc(33.366% - 1em)}
    .visual .result_list a{padding:.5em 0 1em 0}
    .visual .result_list dt{margin-bottom:.25em; padding:0 5px}
    .visual .result_list p{padding-top:1em;}
}



/* -------------------------- info -------------------------- */
.info{background:var(--color-ygreen) url(../images/main/bg_hill.png) no-repeat 0 bottom; position:relative;}
.info:before,
.info:after{content:""; display:block; position:absolute; width:7em; height:5em; top:-5em;}
.info:before{background:url(../images/main/bg_greenL.png) no-repeat 0 bottom / contain; left:0}
.info:after{background:url(../images/main/bg_greenR.png) no-repeat right bottom / contain;right:0}

/* -------------------------- info>infozon -------------------------- */
.infozon{position:relative;  padding-bottom:.2em; background:#fff; border-radius:10px; overflow:hidden; margin-bottom:1.5em; max-width:400px; margin-left:auto; margin-right:auto; box-shadow:5px 5px 5px rgb(0, 0, 0, .1)}
.infozon h2{position:absolute; bottom:.65em; left:1em; color:var(--color-ygreen); font-size:1.2em;}

.infozon .swiper-slide{width:calc(100vw - 2em); max-width:400px; border-radius:10px; overflow:hidden;}
.infozon .slide_control{ display:flex; flex-wrap:wrap; justify-content:end; align-items:center; text-align:right; padding:.8em 1em .8em 0; }
.infozon .slide_control>*{display:inline-block; width:28px; height:28px; overflow:hidden; border-radius:50%; margin-left:3px; font-size:0; text-indent:-9999em; }
.infozon .swiper-slide>a	{ display:block; position:relative; width:100%; height:0; padding-top:81.754%; overflow:hidden }
.infozon .swiper-slide>a img	{ position:absolute; top:50%; left:50%; min-width:100%; min-height:100%; transform:translate(-50%,-50%); -ms-transform:translate(-50%,-50%); 
																	-webkit-transform:translate(-50%,-50%); -moz-transform: translate(-50%,-50%); object-fit:cover; -o-object-fit:cover;}
.infozon .btn_prev{background:var(--color-ygreen) url(../images/common/arr_l.png) no-repeat 46% center;}
.infozon .btn_next{background:var(--color-ygreen) url(../images/common/arr_r.png) no-repeat 56% center;}
.infozon .btn_stop{background:url(../images/main/stop.png) no-repeat center; border:1px solid var(--color-ygreen)}
.infozon .btn_play{background:url(../images/main/play.png) no-repeat 56% center; border:1px solid var(--color-ygreen)}
@media (min-width:768px){
    .info:before, .info:after{width:9em;}
    .info_wrap{display:flex; justify-content:space-between; flex-wrap:wrap;}
    
    .infozon,
    .infozon .swiper-slide{width:300px;}
    .infozon{height:max-content; margin:0; border-radius:1em;}
    .infozon h2{bottom:1.4em}

    .infozon .slide_control{padding:1.5em 1em .9em 0}
}
@media (min-width:1440px){
    .info:before, .info:after{width:778px; height:342px; background-size:auto; top:-342px;}
    .info_wrap{max-width:1440px; margin:auto; position:relative;}
    .info_wrap:before{content:""; display:block; width:411px; height:385px; background:url(../images/main/girl.png) no-repeat; position:absolute; bottom:-100px; left:-260px; z-index:1}
    .info_wrap:after{content:""; display:block; width:390px; height:397px; background:url(../images/main/balloon.png) no-repeat; position:absolute; top:-210px; right:-130px; z-index:1}

    .infozon,
    .infozon .swiper-slide{width:570px; max-width:570px; border-radius:2em}

    .infozon h2{left:1.5em; font-size:1.5em; bottom:.5em}
    .infozon .slide_control{padding:1.1em 2em .8em 0;}
}

/* -------------------------- info>service -------------------------- */
.service h2{font-family:var(--font-jalnan); color:#fff; position:relative; width:max-content;}
.service h2:after{content:""; display:block; width:50px; height:2px; background:#82940b; opacity:.3; position:absolute; top:.75em; right:-60px;}
.service h3{background:var(--color-brown); color:#fff; width:max-content; padding:.3em 1em; border-radius:30px; margin-bottom:-.8em; position:relative; z-index:1; margin-top:.5em;}
.service ul{background:#fff; border-radius:10px; padding:1.8em 1em 1em 1em; display:flex; flex-wrap:wrap; gap:.75em .5em;}

.service .s_target li{width:calc(50% - .5em); padding-top:1.1em}
.service .s_target button{background:#f4f4f4; border-radius:30px; display:block; width:100%; position:relative; padding:.7em .5em .7em 4.5em; text-align:left;}
.service .s_target .on button,
.service .s_target:not(:has(.on)) button:focus,
.service .s_target:not(:has(.on)) button:hover{background:var(--color-ygreen); transition:all .5s; color:#fff;}

.service .s_target button:before{content:""; display:block; position:absolute; width:3.2em; height:4.2em; bottom:0; left:.5em;}
.service .s_baby:before{background:url(../images/main/s_baby.png) no-repeat bottom right / contain;}
.service .s_girl:before{background:url(../images/main/s_girl.png) no-repeat bottom right / contain;}
.service .s_boy:before{background:url(../images/main/s_boy.png) no-repeat bottom right / contain;}
.service .s_school:before{background:url(../images/main/s_school.png) no-repeat bottom right / contain;}

.service .s_field{justify-content:center;}
.service .s_field li{width:7em;}
.service .s_field li button{display:block; text-align:center; border:1px solid #ddd; border-radius:10px; width:100%; padding:1em }
.service .s_field li.on button{ background:var(--color-ygreen); color:#fff; border-color:var(--color-ygreen)}
.service .s_field li.on button span				{ filter:brightness(100); }
.service .s_field li button span				{ display:flex; margin:0 auto .5em auto; width:28px; height:28px; } 
.service .s_field li button span.f_school		{ background:url(../images/main/f_school.svg) no-repeat 50% 50% / auto;}
.service .s_field li button span.f_culture		{ background:url(../images/main/f_culture.svg) no-repeat 50% 50% / auto;}
.service .s_field li button span.f_leisure		{ background:url(../images/main/f_leisure.svg) no-repeat 50% 50% / auto;}
.service .s_field li button span.f_travel		{ background:url(../images/main/f_travel.svg) no-repeat 50% 50% / auto;}
.service .s_field li button span.f_development	{ background:url(../images/main/f_development.svg) no-repeat 50% 50% / auto;}
.service .s_field li button span.f_career		{ background:url(../images/main/f_career.svg) no-repeat 50% 50% / auto;}
.service .s_field li button span.f_safety		{ background:url(../images/main/f_safety.svg) no-repeat 50% 50% / auto;}


.service_btn{text-align:center; display:flex; justify-content:space-between; flex-wrap:wrap; margin-top:1em; gap:.5em}
.service_btn>*{width:calc(50% - .25em); border-radius:30px; background:#f0f0f0; font-weight:600; padding:.8em 0}
.service_btn i{margin-right:.3em}
.service_btn .color_orange{background:var(--color-orange); color:#fff;}
@media (min-width:768px){
    .service{width:calc(100% - 320px)}
    .service ul{padding-top:1.2em; }
    .service .s_target li{width:calc(25% - .5em); padding-top:.2em}
    .service .s_target button{padding-left:2.5em}
    .service .s_target button:before{width:2.2em; height:3.2em; left:0;}
    .service .s_field li{width:calc((100% - 2em) /5)}
}
@media (min-width:1440px){
    .service{width:calc(100% - 570px - 7em); }
    .service h3{margin-top:1.6em}
    .service ul{padding:2.1em 2em 1.9em 2em;}
    .service .s_target li{position:relative; z-index:2}
    .service .s_target button{padding:1em .5em 1em 5em}
    .service .s_target button:before{width:61px; height:84px; background-size:auto;}
    .service .s_field{gap:1em}
    .service .s_field li{width:calc((100% - 4em) /5)}
    .service_btn{margin-top:2em;}
    .service_btn>*{padding:1em 0; font-size:1.2em}
}

/* -------------------------- news -------------------------- */
.news{background:#edf9fd;}
.news h2{position:relative; width:max-content;}
.news h2:after{content:""; display:block; width:50px; height:2px; background:var(--color-blue); opacity:.3; position:absolute; top:.75em; right:-60px;}
@media (min-width:1440px){
    #main>section.news{padding-left:0; padding-right:0}

    .news>*:not(.gallery){max-width:1440px; margin:auto;}
}
/* -------------------------- news>notice -------------------------- */
.notice_tab{position:relative; margin:1em 0}
.notice_tab ul{width:calc(100% - 5em); max-width:max-content; background:#fff; border-radius:30px; display:flex; flex-wrap:wrap;}
.notice_tab button{padding:.7em .5em; width:100%; font-weight:600;}
.notice_tab .on button{background:var(--color-blue); color:#fff; border-radius:30px; padding:.7em .8em}
.notice_tab .ii_arr{width:2em; height:2em; background:var(--color-blue) url(../images/common/arr_w.png) no-repeat center 40%; border-radius:50%;}
.notice_tab .btn_more{display:none; position:absolute; right:0; top:0; bottom:0; margin:auto; height:max-content;}
.notice_tab .on .btn_more{display:block; color:var(--color-blue); font-weight:600}

.notice_list ul{display:flex; justify-content:space-between; flex-wrap:wrap; gap:1em; margin-bottom:1em}
.notice_list li{width:calc(50% - .5em); background:#fff; border-radius:1.5em; box-shadow:5px 3px 5px rgb(0, 0, 0, .1); padding:1.5em 1em;}
.notice_list dt,
.notice_list dd{text-overflow:ellipsis; word-break: break-word; overflow:hidden; display:-webkit-box; -webkit-box-orient: vertical;}
.notice_list dt span{display:block; margin-bottom:.7em; font-size:.9em}
.notice_list dt{-webkit-line-clamp: 3; line-height:1.3em; height:4.5em; font-weight:600; font-size:1.05em; margin-bottom:.7em}
.notice_list dd:not(:last-child){-webkit-line-clamp: 2; line-height:1.3em; height: 2.5em; font-size:.95em}
.notice_list dd:last-child{font-size:.95em; color:#777; margin-top:.5em}
@media (min-width:768px){
    .notice_list li{width:calc(25% - 1em)}
}
@media (min-width:1440px){
    .notice{position:relative;}
    .notice:before{content:""; display:block; width:700px; height:297px; background:url(../images/main/bg_sky.png) no-repeat; position:absolute; right:0; top:-6em;}
    .notice:after{content:""; display:block; width:231px; height:261px; background:url(../images/main/boy.png) no-repeat; position:absolute; right:7.5em; top:-3em; z-index:1; animation:i_repeat 3s linear infinite normal forwards;}
    .notice>*{position:relative; z-index:1}
    .notice h2{line-height:1; margin-bottom:.8em}
    .notice_tab{margin:1em 0 3.5em 0}
    .notice_tab button,
    .notice_tab .on button{padding:.8em 1.6em .7em 1.6em; font-size:1.1em;  position:relative; display:block;}
    .notice_tab li:not(:first-child) button:before{content:""; display:block; width:1px; height:14px; background:#c8e4ee; position:absolute; top:0; bottom:0; left:-0; margin:auto;}
    .notice_tab li.on button:before,
    .notice_tab .on + li button:before{display:none;}

    .notice_list ul{gap:1.8em; margin-bottom:2em}
    .notice_list li{padding:3em 2em; border-radius:2.5em; width:calc(25% - 1.8em)}
    .notice_list dt{font-size:22px; margin-bottom:1em}
    .notice_list dt span{margin-bottom:.7em; font-size:16px}
    .notice_list dd:not(:last-child){font-size:1em; line-height:1.4em;}
    .notice_list dd:last-child{margin-top:2em}
}
@media (max-width:414px){
	.notice					{ position:relative; padding-bottom:2em; }
	.notice_tab				{ position:initial; }
	.notice_tab ul			{ width:100%; max-width:inherit }
	.notice_tab ul>li		{ flex:auto; }
	.notice_tab .btn_more	{ top:inherit; right:inherit; left:50%; transform:translateX(-50%); }
}
/* -------------------------- news>sns -------------------------- */
.news .sns>*{border-radius:50px; padding:.5em; display:flex; justify-content:space-between; flex-wrap:wrap; align-items:center; margin-top:.5em}
.news .sns h3{overflow:hidden; line-height:5000; height:1em; width:5em}
.news .sns ul{background:#fff; border-radius:50px; width:calc(100% - 6em); padding:.5em 1em;}
.news .sns li{position:relative;}
.news .sns li a{position:relative; padding-left:.65em; display:flex; justify-content:space-between; align-items:center;}
.news .sns li:before{content:""; display:block; width:4px; height:4px; border-radius:50%; position:absolute; top:0; bottom:0; margin:auto; left:0}
.news .sns li strong{font-weight:600; display:block; width:calc(100% - 6em); text-overflow:ellipsis; overflow:hidden; white-space:nowrap;}
.news .sns li span{font-size:.9em}
.news .blog,
.news .blog li:before{background:#65c617}
.news .blog h3{background:url(../images/main/blog.png) no-repeat center / contain;}
.news .youtube,
.news .youtube li:before{background:#f24d21}
.news .youtube h3{background:url(../images/main/youtube.png) no-repeat center / contain;}
@media (min-width:768px){
    .news .sns{display:flex; justify-content:space-between; flex-wrap:wrap; gap:1em;}
    .news .sns>*{width:calc(50% - .5em)}
}
@media (min-width:1440px){
    .news .sns>*{padding:.6em}
    .news .sns h3{width:7em; height:2em; background-size:auto;}
    .news .sns ul{padding:1em 1.5em; font-size:18px; width:calc(100% - 7.5em)}
    .news .sns li{padding-left:.8em}
    .news .sns li:before{width:5px; height:5px;}
}


/* -------------------------- gallery -------------------------- */
.gallery{position:relative; margin-top:3em}
.gallery:before{content:""; display:block; background:var(--color-green); border-radius:0 1em 1em 0; width:calc(100% - 1em); height:15em; position:absolute; left:-1em; top:-1.5em;}
.gallery h2{color:#fff; margin-bottom:.5em}
.gallery h2:after{background:#fff71f; opacity:1}
.gallery p{position:relative; z-index:1; line-height:1.3; color:#fff; font-size:.9em; width:90%; margin-bottom:.5em}
.gallery_slide{padding-right:1em; padding-bottom:1em;}
.gallery .swiper-slide{width:calc(100vw - 2em);transition:all 1s;}
.gallery .swiper-slide-active:before{content:""; display:block; width:calc(100% - 10px); height:calc(100% - 10px); background:var(--color-green); position:absolute; top:10px; left:10px; border-radius:3em; z-index:-1; opacity:.2}
.gallery .gallery_wrap{background:#fff; overflow:hidden; border-radius:3em; box-shadow:5px 3px 5px rgb(0, 0, 0, .1); margin:0 10px 10px 0; position:relative;}
.gallery .swiper-slide-active .gallery_wrap{box-shadow:none;}
.gallery .gallery_wrap div{width:100%; height:0; padding-top:48%; position:relative; overflow:hidden; border-radius:2em; background:#f4f4f4; position:absolute; top:0; left:0;}
.gallery .gallery_wrap div:not(:has(img)) 				{ background-image:url(../images/common/img_none.png); background-size:cover;}


.gallery .swiper-slide-active .gallery_wrap div{width:calc(100% - 2em); left:1em; top:1em; transition:all 1s;}
.gallery .gallery_wrap div img{position:absolute; top:50%; left:50%; min-width:100%; min-height:100%; transform:translate(-50%,-50%); -ms-transform:translate(-50%,-50%); 
																	-webkit-transform:translate(-50%,-50%); -moz-transform: translate(-50%,-50%); object-fit:cover; -o-object-fit:cover;}


.gallery .gallery_wrap:has(.tit_movie) div:before{content:""; display:block; width:5em; height:5em; background:url(../images/main/movie.png) no-repeat center / contain; position:absolute; top:0; left:0; right:0; bottom:0; margin:auto; z-index:3}
.gallery dl{padding:calc(50vw + 1em) 2em 1em 2em; position:relative;}
.gallery dt{font-weight:600; text-overflow:ellipsis; white-space:nowrap; overflow:hidden; padding-right:60px}
.gallery dt span{display:block; position:absolute; bottom:1em; right:1em; width:50px; height:50px; background:var(--color-green); border-radius:50%; color:#fff; text-align:center; line-height:3.5em; font-size:14px; font-weight:bold;}
.gallery dt span.tit_photo{background:var(--color-blue)}
.gallery dd{font-size:.95em}
.gallery .slide_control{position:relative; display:flex; justify-content: end; align-items:center; margin-top:.5em}
.gallery .slide_control:before{content:""; display:block; width:calc(100% - 9em); height:1px; background:#86bca0; position:absolute; top:0; bottom:0; left:-1em; margin:auto;}
.gallery .slide_control>*{position:relative; z-index:1; width:max-content}
.gallery .slide_paging{top:auto; bottom:auto; color:#86bca0; width:4em; text-align:center;}
.gallery .slide_paging>*:first-child{font-weight:bold; color:var(--color-green);}
.gallery .slide_control [class^="btn_"]{border-radius:50%; background:var(--color-green); background-repeat:no-repeat; background-position:center; width:3em; height:3em; line-height:5000; overflow:hidden;}
.gallery .slide_control .btn_prev{background-image:url(../images/common/arrB_l.png);}
.gallery .slide_control .btn_next{background-image:url(../images/common/arrB_r.png);}
@media (min-width:768px){
    .gallery{margin-top:5em;}
    .gallery:before{width:45%; left:-1.5em; top:-2.5em}

    .gallery_tit{position:absolute; top:-1em; left:0}

    .gallery .swiper-slide{width:calc(33.3vw - 1.5em - 10px); margin:5px 2em 5.5em 0;}
	.gallery .gallery_wrap div		{ padding-top:63%; }
    .gallery dl{padding-top:calc(20vw + 1em)}

    .gallery .slide_control{position:absolute; width:100%; bottom:1.5em; left:0}
    .gallery .slide_control:before{left:-1.5em}
    .gallery .swiper-slide-active{margin-top:5.5em; margin-bottom:5px;}
}
@media (min-width:1440px){
    .gallery{margin-top:14em;}
    .gallery:before{top:-6em; border-radius:0 3em 3em 0; height:500px; width:38.5%}
    .gallery_container{max-width:1440px; margin:auto; position:relative;}

    .gallery_tit{top:0; width:100%;}
    .gallery_tit p{font-size:18px}

    .gallery .swiper-slide{width:395px; margin-right:5em; margin-bottom:10em;}
    .gallery .swiper-slide-active{margin-right:11em; margin-top:10em; margin-bottom:0}
	.gallery .gallery_wrap div		{ padding-top:78%; }

    .gallery .gallery_wrap:has(.tit_movie) div:before{width:121px; height:121px;}
    .gallery dl{padding:calc(300px + 2em) 2em 2em 2em}
    .gallery dt{font-size:20px; margin-bottom:.5em;}
    .gallery dt span{width:65px; height:65px; font-size:16px; line-height:4em; bottom:1.8em; right:1.5em}

    .gallery .slide_control{bottom:4em}
    .gallery .slide_control:before{left:0;}
    
}