.medical-page #app{padding-bottom:0}
.medical-page .inner{max-width:968px;margin:0 auto}
.medical-page #kv{padding:0;position:relative}
.medical-page #kv video{display:block;width:100%;height:calc(100vh - 64px);object-fit:cover;min-height:400px}
.medical-page #kv::after{content:"";position:absolute;width:100%;height:100%;top:0;left:0;background:rgba(0,0,0,.2)}
.medical-page #kv .text{position:absolute;top:50%;transform:translateY(-50%);padding-left:5%;padding-right:5%;color:#0f2db3;z-index:1;text-align:left}
.medical-page #kv .text h1{color:#fff;padding-bottom:10px}
.medical-page #kv .text p{font-size:1.5rem;line-height:2rem;max-width:650px;color:#fff}
.medical-page #core{background:url("../img/bg-core.png") no-repeat top center/cover;padding-top:150px}
.medical-page #list{background:url("../img/bg-list.png") no-repeat top center/cover;position:relative;padding-bottom:20px}
.medical-page #list::before{content:"";position:absolute;top:-40px;border:1px solid #0f2db3;left:0;right:0;margin:0 auto;height:80px;width:0}
.medical-page #list h1{padding-bottom:40px}
.medical-page #list .item{padding:40px 40px 105px;border-radius:8px;overflow:hidden;border:1px solid #fff;box-sizing:border-box;background-image:linear-gradient(to bottom,#f1f5ff,#eef3ff,#ebf0ff,#e7eeff,#e4ecff)}
.medical-page #list .item img{width:50%;max-width:250px;margin-bottom:20px;border-radius:50%}
.medical-page #list .item h5{font-weight:400;font-size:1rem;letter-spacing:initial;line-height:1.5rem;padding-bottom:3px}
.medical-page #list .item h4{font-weight:400;font-size:1.5rem;letter-spacing:initial;line-height:2rem;padding-bottom:22px}
.medical-page #list .item .rows{font-size:.88rem;line-height:1.4rem;text-align:left;color:#515151}
.medical-page #list .item .rows .row{display:flex;flex-direction:row;flex-wrap:nowrap;align-content:center;justify-content:center;align-items:center;align-items:flex-start;padding-top:5px}
.medical-page #list .item .rows .row.row-email .content{overflow:hidden;text-overflow:ellipsis;overflow-wrap:initial}
.medical-page #list .item .rows .row:first-child{padding-top:0}
.medical-page #list .item .rows .label{width:40px}
.medical-page #list .item .rows .content{width:calc(100% - 40px);padding-left:5px;box-sizing:border-box;overflow-wrap:break-word;word-wrap:break-word}
.medical-page #list .item .rows .content a,
.medical-page #list .item .rows .content a:active,
.medical-page #list .item .rows .content a:hover,
.medical-page #list .item .rows .content a:link,
.medical-page #list .item .rows .content a:visited{color:#515151}
.medical-page #list .item .rows .content a:hover{text-decoration:underline}
.medical-page #list .item .btn-go-action{font-weight:600;background:#0f2db3;color:#fff;transition:all .4s ease;display:block;padding:12px 10px;width:150px;border-radius:25px;margin:0 auto;position:absolute;bottom:40px;left:0;right:0;border:1px solid #0f2db3}
.medical-page #list .item .btn-go-action:hover{background:#fff;color:#0f2db3}

.medical-page .shops{display: grid;gap: 20px;grid-template-columns: repeat(auto-fill, minmax(360px, 1fr))}
.medical-page .shops .item{position:relative}

.medical-page #reservation{display:none;background:url(../img/bg-reservation.png) no-repeat top center/cover}
.medical-page #reservation.show{display:block;margin-top:-100px;position:relative}
.medical-page #reservation .form-wrapper{text-align:left;align-items:flex-start}
.medical-page #reservation .form-wrapper .form{width:40%;padding-right:40px;box-sizing:border-box}
.medical-page #reservation .form-wrapper .image{width:60%;padding-left:40px;box-sizing:border-box}
.medical-page #reservation .form-wrapper h3{font-weight:400}
.medical-page #reservation .form-wrapper h3 #shop-name{font-weight:600;font-size:1.75rem;line-height:2.3rem;display:block}
.medical-page #reservation .form-wrapper .ugc-address{color:#0f2db3;padding-top:2px;padding-bottom:30px}
.medical-page #reservation .form-wrapper .row{color:#515151;margin-bottom:16px}
.medical-page #reservation .form-wrapper .row input,
.medical-page #reservation .form-wrapper .row select{background:#e4ecff;border:1px solid #fff;width:100%;display:block;box-sizing:border-box;padding:10px 20px;margin:0}
.medical-page #reservation .form-wrapper .row input.err,
.medical-page #reservation .form-wrapper .row select.err{border:1px solid red}
.medical-page #reservation .form-wrapper .row input::placeholder{color:#9598bc}
.medical-page #reservation .form-wrapper .row input:focus{background:#d9e3fa}
.medical-page #reservation .form-wrapper .row select{cursor:pointer}
.medical-page #reservation .form-wrapper .row.shops{display:none}
.medical-page #reservation .form-wrapper .row.shops.show{display:block}
.medical-page #reservation .form-wrapper .row.checking{font-size:.88rem;color:red;display:none}
.medical-page #reservation .form-wrapper .row.checking .p2{display:none}
.medical-page #reservation .form-wrapper .row.checking.show{display:block}
.medical-page #reservation .form-wrapper .row.checking.show2 .p2{display:block}
.medical-page #reservation .form-wrapper .row.checking.show2b p{display:none}
.medical-page #reservation .form-wrapper .row.checking.show2b .p2{display:block}
.medical-page #reservation .form-wrapper .row.checkbox{font-size:.88rem;position:relative;padding-left:34px;box-sizing:border-box;line-height:27px}
.medical-page #reservation .form-wrapper .row.checkbox+.checkbox{margin-bottom:30px}
.medical-page #reservation .form-wrapper .row.checkbox input{opacity:0;z-index:1;position:absolute;top:0;left:0;width:24px;height:24px;cursor:pointer;padding:0}
.medical-page #reservation .form-wrapper .row.checkbox input:checked~.check{background:url(../img/tick.png) no-repeat center center/50%}
.medical-page #reservation .form-wrapper .row.checkbox .check{position:absolute;top:0;left:0;width:24px;height:24px;background:#e4ecff;border:1px solid #fff}
.medical-page #reservation .form-wrapper .row.checkbox .check.err{border:1px solid red}
.medical-page #reservation .form-wrapper .row.checkbox label{cursor:pointer}
.medical-page #reservation .form-wrapper .row.checkbox .popup-terms{cursor:pointer;text-decoration:underline}
.medical-page #reservation .form-wrapper .row:last-child{margin-bottom:0}
.medical-page #reservation .form-wrapper .row #btn-reservation{display:block;background:#fff;transition:all .4s ease;color:#000;line-height:50px;text-align:center;margin-top:20px}
.medical-page #reservation .form-wrapper .row #btn-reservation:hover{background:#0f2db3;color:#fff}
.medical-page #reservation .form-wrapper .row #btn-reservation.disabled{cursor:default;opacity:.5}
.medical-page #reservation .form-wrapper .row #btn-reservation.disabled:hover{color:#000;background:#fff}

.medical-page #kv .text h1{color:#fff;text-shadow:none}
.medical-page #core{background:url(../img/bg-core2.png) no-repeat top center/cover}
.medical-page #list{padding-bottom:100px;background:url(../img/bg-list2.png) no-repeat top center/cover}
.medical-page #reservation{background:url(../img/bg-reservation2.png) no-repeat top center/cover}

.medical-page #core .owl-core .animated{animation-duration:.8s}
.medical-page #core .owl-core .owl-item{opacity:0;transition:all .4s ease}
.medical-page #core .owl-core .owl-item.active{opacity:1}
.medical-page #core .owl-core h2{font-size:1.75rem;line-height:2rem;text-align:left;padding-bottom:40px;font-weight:400;width:150%}
.medical-page #core .owl-core h2 span{display:block;padding-bottom:20px;font-size:2.6rem;line-height:3rem}
.medical-page #core .owl-core p{text-align:left}
.medical-page #core .owl-core p .title{color:#0f2db3}
.medical-page #core .owl-core .item{display:flex;flex-direction:row;flex-wrap:nowrap;align-content:center;justify-content:center;align-items:center;align-items:flex-start}
.medical-page #core .owl-core .text{width:55%;position:relative;z-index:1;padding-right:40px;box-sizing:border-box;padding-left:5px}
.medical-page #core .owl-core .image{width:45%}
.medical-page #list .owl-shops{margin:0 auto}

@media only screen and (max-width:767px){
	.medical-page #kv video{object-fit:cover;height:calc(100dvh - 64px)}
	.medical-page #core{padding-top:105px}
	.medical-page #list::before{top:-20px;height:40px}
	.medical-page #list h1{padding-bottom:20px}
	.medical-page #list .item{padding-left:30px;padding-right:30px;padding-bottom:115px}
	.medical-page #list .item h5{padding-bottom:3px}
	.medical-page #reservation.show{margin-top:-50px}
	.medical-page #reservation .form-wrapper{flex-direction:column-reverse}
	.medical-page #reservation .form-wrapper .form{width:100%;padding-right:0}
	.medical-page #reservation .form-wrapper .image{width:100%;padding-left:0}
	.medical-page #reservation .form-wrapper h3{padding-top:20px}
	.medical-page #list{padding-bottom:50px}
	
	.medical-page #core .owl-core h2{font-size:1.6575rem;line-height:1.9125rem;padding-bottom:20px;width:100%}
	.medical-page #core .owl-core h2 span{padding-bottom:10px;font-size:1.95rem;line-height:2.25rem}
	.medical-page #core .owl-core .owl-item{height:0}
	.medical-page #core .owl-core .owl-item.active{height:auto}
	.medical-page #core .owl-core .item .text{width:100%;padding-right:5px}
	.medical-page #core .owl-core .item .text p{width:100%}
	.medical-page #core .owl-core .item .text img{padding-bottom:20px}
	.medical-page #core .owl-core .item .image{display:none}
	.medical-page #list .owl-shops{margin-top:65px}
}