@charset "UTF-8";

/* ------------------------------------------------------------------
intial set
------------------------------------------------------------------ */

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
margin:0px;
padding:0px;
border:0px;
outline:0px;
font-weight:inherit;
font-style:inherit;
font-size:100%;
font-family:inherit;
vertical-align:baseline;
box-sizing:border-box;
}

html{font-size:16px;}
body{
color:#595959;
text-align: center;
font-size:1rem;
font-family:"Lucida Grande", "segoe UI", "ヒラギノ丸ゴ ProN W4", "Hiragino Maru Gothic ProN", Meiryo, Arial, sans-serif;
-webkit-text-size-adjust: 100%;
box-sizing:border-box;
letter-spacing:1px;
}

a{color:#4c4c4c; text-decoration:none;}
a:hover{opacity:0.8;}
a:active{color:#4c4c4c; text-decoration:none;}

p{
line-height:1.8;
letter-spacing: 2px;
margin:0 0 1.6rem 0;
text-align:justify;
word-break: break-all;
}

img{
border: 0px;
vertical-align: bottom;
max-width:100%;
}

.pink{color:#FFBCD1 !important;}
.green{color:#8cdbc3 !important;}

.redborder{
border:4px solid #E50012;
display:block;
padding:0.4rem;
}

.left{text-align:left;}
.right{text-align:right;}
.center{text-align:center;}
.line{display:inline-block;}
.nobr{white-space:nowrap;}
.small{font-size:90%;}

.caution{color:#05AFB6}
.underline{text-decoration: underline;}

.fa_icon::before, .fa_icon::after, .btnlink::before{
 display: inline-block;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
}

ol, ul {list-style:none;}
ul {
display: inline-block;
box-sizing:border-box;
width: 100%;
margin:0 0 2rem 0;
line-height:1.8;
}
li{
line-height:1.8;
letter-spacing: 2px;
text-align:justify;
}

ul.indent{margin:0 0 1rem 0.6rem;}
ul li{position: relative;}
ul.dot li{
padding-left:1rem;
}
ul.dot li:before{
border-radius: 50%;
width: 6px;
height: 6px;
display: block;
position: absolute;
left: 0; 
top: 0.7rem;
content: "";
background:#FFBCD1;
}
li img {vertical-align: bottom;}

ul.disc{
padding:0 0 0 1rem;
}
ul.disc li{
list-style-type:disc;
margin-bottom:4px;
text-align:left;
}

strong{font-weight:bold;}
.bottom0{margin-bottom:0;}
.bottomhalf{margin-bottom:0.5rem;}
.bottom1rm{margin-bottom:1rem;}
div.sub, p.sub, ul.sub, .flow p.sub{margin-bottom:1.4rem;}
div.end, p.end, ul.end, .flow p.end{margin-bottom:3rem;}
.nopoint{pointer-events: none;}
i{
margin-right:0.4rem;
color:#FFBCD1;
vertical-align:baseline;
}

.wf-loading { visibility: hidden;}
.wf-active { visibility: visible;}

h1, .link, .ttl, .icon, .catch, .btnlink, ul#gNav li a, div#header .block p a, .sub-menu, .flogo, h2,h3,h4,h5,.subttl, ul.cPhoto li span, .servicelist a, #navToggle, .font, .mn_col{
font-family: "dnp-shuei-mgothic-std", sans-serif;
font-weight: 400;
font-style: normal;
}

.btnlink a{
padding:10px;
background:rgba(255,255,255,0.7);
border-radius:8px;
border:2px solid #05AFB6;
display:block;
}
.btn a{
display:inline-flex;
align-items:center;
justify-content:center;
text-align:center;
width:40%;
max-width:500px;
border-radius:4rem;
padding:0.6rem;
margin:10px 0;
box-sizing:border-box;
}
.btn a, .btn i{
color:rgba(255,255,255,0.9);
margin:0 0 0 0.4rem;
}

.main-header h1{
font-size:1.8rem;
}
.main-header h1 span{
display:block;
font-size:0.8rem;
color:rgba(0,0,0,0.3);
}

h2{
font-size:1.4rem;
margin:0 0 2rem;
line-height:1.6;
}

#content-top h2{
color: #444;
}

h3{
font-size:1.2rem;
margin:0 0 1.6rem 0;
}


h4{
font-size:1.1rem;
margin:0 0 0.6rem 0;
text-align:left;
}


h5{
font-size:1rem;
margin:0 0 14px 0;
text-align:left;
}

#footer .telink, main .telink, .flow .resv{
font-size:1.2rem;
}

main .telink{
font-size:120%;
}

ruby rt{
font-weight:bold;
}


/* ------------------------------------------------------------------
header
------------------------------------------------------------------ */

div#header{
width:100%;
max-width:1200px;
height:600px;
box-sizing:border-box;
margin:0 auto;
position:relative;
background:#faf0d3;
}


.content-page div#header{
height:300px;
}

div#header .bgimg{
position:absolute;
left:1.4rem;
opacity:0;
width:calc(100% - 2.8rem);
height:calc(100% - 1.4rem);
border-radius:2rem;
animation:bgfade 18s infinite;
clip-path: inset(calc(150px - (1200px - 100vw)*0.05 ) 0 0 0 round 1rem);
}

div#header .h_src01{
background: url("../img/top/header-bg01.jpg?2311") 50% 20% / cover;
}
div#header .h_src02{
background: url("../img/top/header-bg02.jpg?2311") 50% 20% / cover;
animation-delay  : 6s;
}
div#header .h_src03{
background: url("../img/top/header-bg03.jpg") 0 20% / cover;
animation-delay  : 12s;
}
div#header .h_src04{
background: url("../img/top/header-bg04.jpg") 50% 0% / cover;
animation-delay  : 18s;
}

@keyframes bgfade { 
   0% { opacity: 0; }
   11% { opacity: 1; } /* 2 / 18 */
  33% { opacity: 1; } /* 6 / 18 */
  44% { opacity: 0; } /* 8 / 18 */
 100% { opacity: 0; }
}

.content-page div#header .bgimg{
animation:none;
}
div#header .src_content {
opacity:1;
background: url("../img/common/header-bg.jpg") 0 20% / cover;
clip-path: inset(0 0 0 0 round 1rem);
}

div#header .logo{
box-sizing:border-box;
text-align:left;
width:40%;
display: flex;
margin:0;
}
div#header .logo a{
box-sizing:border-box;
margin:0 0 0;
display:flex;
align-items:center;

}
div#header .logo a img{
box-sizing:border-box;
padding:0.4rem;
max-width:400px;
}
div#header .logo a:hover{
opacity:1;
}
div#header .infohead{
width:58%;
display:flex;
flex-direction:column;
justify-content:flex-end;
align-items:flex-end;
}

div#header .block{
padding:0.6rem 0.6rem 0;
box-sizing:border-box;
width:100%;
display:flex;
justify-content:flex-end;
max-height:300px;
margin:0 auto;
position:relative;
}
.content-page div#header .block{
background:#faf0d3;
}

div#header .block .info{
display:flex;
justify-content:flex-end;
margin:0;
}
div#header .block .info p{
padding:0 0.2rem;
vertical-align:top;
display:inline-block;
margin:0;
box-sizing:border-box;
font-size:1.2rem;
white-space:nowrap;
}
div#header .block .info p a{
text-align:center;
line-height:1.4;
display: flex;
justify-content: center;
align-items: center;
background:rgba(255,255,255,0.7);
border-radius:4rem;
padding:0.8rem 1rem 0.8rem;
box-sizing:border-box;
border:2px solid #927864;
height:56px;
}
div#header .block .info p a:hover{
background:#F4B2BA;
}
div#header .block .info p a .sp{
font-size:90%;
background:rgba(255,255,255,0.4);
padding:0.2rem;
margin-left:0.4rem;
}
div#header .block .info p a{
color:#59493d;
}

div#header .block .info p.tel a, #info .contact p.tel a{
background:#baeee0;
border:1px solid #4abf9e;
}
div#header .block .info p.resv a, #info .contact p.resv a{
background:#f5ccd0;
border:1px solid #4abf9e;
}
div#header .block .info p.resv a i, #info .contact p.resv a i{
color:#f48d98;
}
div#header .block .info p.monshin a, #info .contact p.monshin a{
background:#b5e2b8;
border:1px solid #80af82;
line-height:1.2;
}
div#header .block .info p.monshin a i, #info .contact p.monshin a i{
color:#449949;
}
div#header .block .info p.monshin.adult a, #info .contact p.monshin.adult a{
background:#b5e0da;
border:1px solid #90b2ad;
}
div#header .block .info p.monshin.adult a i, #info .contact p.monshin.adult a i{
color:#51bcbc;
}

div#header .block .info .monshin-all{
display:flex;
}

div#header .catch{
text-align:center;
display:block;
position:absolute;
width:100%;
bottom:32%;
font-size:1.2rem;
color:#4c3f34;
}
div#header .catch span{
font-size:110%;
}
.fadeIn{
animation-name:fadeInObj;
animation-duration:2.8s;
animation-fill-mode:forwards;
opacity:0;
}
@keyframes fadeInObj{
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
.shadow{
    padding: 10px;
    color: #CCC;
    font-size: 100px;
    text-shadow:
            2px 2px 2px rgba(255,255,255,0.4), -2px -2px 2px rgba(255,255,255,0.4),
           -2px 2px 2px rgba(255,255,255,0.4),  2px -2px 2px rgba(255,255,255,0.4),
            2px 0px 2px rgba(255,255,255,0.4), -2px -0px 2px rgba(255,255,255,0.4),
            0px 2px 2px rgba(255,255,255,0.4),  0px -2px 2px rgba(255,255,255,0.4);
    margin: 0;
}
.shadow01{
    padding: 10px;
    text-shadow:
            2px 2px 2px rgba(255,255,255,0.6), -2px -2px 2px rgba(255,255,255,0.6),
           -2px 2px 2px rgba(255,255,255,0.6),  2px -2px 2px rgba(255,255,255,0.6),
            2px 0px 2px rgba(255,255,255,0.6), -2px -0px 2px rgba(255,255,255,0.6),
            0px 2px 2px rgba(255,255,255,0.6),  0px -2px 2px rgba(255,255,255,0.6);
    margin: 0;
}

div#header.fixed .block{
position:fixed;
z-index:200;
background:#faf0d3;
padding:0;
max-width:none;
left:0;
top:0;
width:100%;
}
div#header.fixed .block .info{
top:15%;
position:fixed;
right:1rem;
flex-direction:column;
width:auto;
}
.close{display:none}
div#header.fixed .block .info .close{
z-index:300;
cursor: pointer;
display:flex;
justify-content:center;
align-items:center;
width:30px;
height:30px;
position:absolute;
top:-14px;
right:calc(50% - 15px);
background:rgba(255,248,220,0.8);
border:1px solid #aaa;
border-radius:15px;
}
div#header.fixed .block .info .close i{
margin:0;
color:#aaa;
}
div#header.fixed .block .info.off{
display:none;
}

div#header.fixed .block .info p{
width:100%;
padding:0;
opacity:0.9;
}
div#header.fixed .block .info p i{
margin:0 0 0.2rem;
}
div#header.fixed .block .info p a{
border:none;
width:160px;
height:160px;
border-radius:160px;
flex-direction:column;
padding:1rem 0.4rem;
letter-spacing:0;
}
div#header.fixed .block .info p a .sp{
font-size:70%;
background:none;
margin:0;
}

div#header.fixed .block .infohead{
width:calc(100% - 120px);
align-items:center;
justify-content:center;
}
div#header.fixed .logo{

}


.infohead nav{width:100%;}
ul#gNav {
display:flex;
justify-content:center;
box-sizing:border-box;
margin:1rem auto 0;
padding:0 0 1rem;
text-align:center;
width:100%;
position:relative;
}

ul#gNav li {
display:inline-block;
text-align:center;
box-sizing:border-box;
margin:0;
vertical-align:top;
position:relative;
line-height:1.2;
padding:0
}
ul#gNav li + li{
margin-left:1vw;
}

ul#gNav li a{
letter-spacing:1px;
font-size:1.1rem;
padding:0.8rem 1.4vw;
display:block;
text-align:center;
position:relative;
box-sizing:border-box;
}
ul#gNav li + li a:after{
content:"";
position:absolute;
left:-0.5vw;
top:0.3vw;
height:calc(100% - 0.6vw);
width:100%;
border-left:1px dashed #927864;
}
ul#gNav li a:hover{
background:rgba(255,255,255,0.3);
color:#776252;
opacity:1;
}

ul#gNav li ul.child{
position:absolute;
top:calc(100% - 6px);
left:calc( 50% - 350px );
z-index:1000;
visibility: hidden;
opacity: 0;
display:flex;
flex-wrap:wrap;
justify-content:space-between;
width:700px;
padding:0;
box-sizing:border-box;
}
ul#gNav li ul.child li{
display:inline-flex;
align-items:center;
justify-content:center;
width:20%;
margin:0;
border:1px solid rgba(255,255,255,0.6);
}
ul#gNav li ul.child li a{
padding:0.6rem 0.4rem;
display:flex;
align-items:center;
justify-content:center;
background:#FFBCD1;
width:100%;
height:50px;
font-size:0.9rem;
}
ul#gNav li ul.child li a, ul#gNav li ul.child li i{
color:rgba(255,255,255,0.9);
}
ul#gNav li ul.child li i{
margin:0 0 0 0.2rem;
}
ul#gNav li:hover ul.child{
    visibility: visible;
    opacity: 1;
}
/*ul#gNav li ul.child{
    visibility: visible;
    opacity: 1;
}*/

.fixed ul#gNav{
margin:0;
padding:0.4rem;
}

#navToggle {
    display:none;
    }
#navToggle div {
border-radius:6px;
    height:38px;
}
#navToggle span {
    display:block;
    position:absolute;
    width:60%;
	height: 4px;
    margin:0 20% 0;
border-radius: 4px;
background-color: rgba(255,255,255,0.7);
    -webkit-transition: .35s ease-in-out;
    -moz-transition: .35s ease-in-out;
    transition: .35s ease-in-out}
#navToggle span:nth-child(1) {top:8px}
#navToggle span:nth-child(2) {top:18px}
#navToggle span:nth-child(3) {top:28px}



/* ------------------------------------------------------------------
content
------------------------------------------------------------------ */

div#wrapper{
	width:100%;
	margin:0 auto;
	background-size:contain;
background:#faf0d3;
}

div#content-top, div.content{
	overflow:hidden;
	margin:0 auto;

}
div#content-top .btn{
text-align:center;
}

#content-top section{
display: block;
box-sizing:border-box;
padding:3rem 1rem 3rem;
}

main section{
text-align:center;
padding:9rem 10% 8rem;
box-sizing: border-box;
}

.inner{
max-width:900px;
margin:0 auto;
}


.main-header{
padding:3rem 0;
background: url("../img/common/content-bg-tp.jpg") 0 0;
background-size:cover;
}

ul.breadcrumb{
text-align:right;
font-size:0.8rem;
margin: 0 0 3rem;
}
ul.breadcrumb li, ul.breadcrumb li a {
display:inline-flex;
align-items:center;
color:#999;
}

/*
ul.breadcrumb li + li:before{
font-family: "Font Awesome 6 Pro";
font-weight: 900;
content: "\f054";
}*/

.cal{
margin-bottom:20px;
text-align:center;
}


.car i{
margin-right:4px;
}

.nav{
margin:2rem 0 2rem;
}
.nav ul{
text-align:center;
}
.nav ul li{
display:inline-block;
vertical-align:top;
border:2px solid #05afb6;
background:rgba(255,255,255,0.7);
border-radius:6px;
margin:1%;
position:relative;
}
.nav ul li a{
font-size:1rem;
color:#05afb6;
box-sizing:border-box;
display:table-cell;
vertical-align:middle;
padding:1rem 0 1rem;
letter-spacing:0;
}
.nav ul li a span{
padding:0.6rem 1rem;
}
.nav ul li a i{
margin:0 0 0 0.6rem;
}

.overlay{
display:none;
background:rgba(255,255,255,0.8);
height: 100%;
width: 100%;
z-index:10;
position:fixed;
top:60px;
}
.openNav .overlay{
display:block;
}

ol{
counter-reset: item;
list-style-type: none;
padding-left: 0;
}
ol li{
margin:0 0 0.6rem;
text-align:left;
}
ol li:before {
display:inline-flex;
justify-content:center;
align-items:center;
counter-increment: item;
content: counter(item);
border-radius:50%;
background:#faf0d3;
width:30px;
height:30px;
margin:0 0.4rem 0 0;
}

h1{
text-align:left;
color:#917c67;
line-height:1.2;
position:absolute;
top:0;
left:0;
font-size:1.2vw;
padding:0.4rem 0 0.4rem 1rem;
display:block;
width:100%;
margin:0 auto;
box-sizing:border-box;
}
h1 span{
display:inline-block;
letter-spacing:0;
}

.content main{
background:#fff;
margin:0 auto 3rem;
max-width:1140px;
border-radius:0 0 0.6rem 0.6rem
}

main .ttl{
margin:0;
padding:3rem 0;
font-size:1.8rem;
text-align:center;
}



main .inner{
margin:0 auto;
padding:0 1rem 3rem;
}

main h2{
color:#555;
margin:3rem 0 2rem;
text-align:left;
display:flex;
align-items: center;
flex-wrap:wrap;
}


main .ttl + h2{
margin:0 0 2rem;
}

main h3{
text-align:left;
margin:0 0 1rem;
}
.content main h3:nth-of-type(n+1) i{
color:#EAD578;
}
.content main h3:nth-of-type(2n) i{
color:#F4B2BA;
}

.content i{color:#FFBCD1;}

/* ------------------------------------------------------------------
footer
------------------------------------------------------------------ */


div#footer{
	padding:3rem 0;
	margin: 0 auto;
	position:relative;
	overflow:hidden;
    background: rgba(255,255,255,0.9);
}


div#footer ul#fNav {
	overflow:hidden;
	margin:0 0 20px 0;
	letter-spacing:2px;
	display:flex;
	flex-wrap:wrap;
	justify-content:center;

}
div#footer ul#fNav i{
color:#d2b25b;
}

div#footer ul#fNav li {
display:inline-block;
list-style-type: none;
margin: 0 0.6rem 0.6rem;
padding:0;
box-sizing: border-box;
}
div#footer ul#fNav li a{
display:block;
}
 div#footer ul#fNav li:before{
 content:none;
 }   


div#footer p.copy{
text-align: center;
margin:0 1rem;
}

div#footer div#fInfo{
	clear: both;
	text-align:center;
	margin:0 0 30px;
}
div#footer div#fInfo img{
border-radius:6px;
}



div#footer div#fInfo p, div#footer div#fInfo a{
	display:inline-block;
	vertical-align:middle;
	text-align:center;
	width:100%;
	letter-spacing: 1px;
	margin:10px 0;
}
div#footer div#fInfo .flogo{
font-size:1.4em;
}
div#footer div#fInfo .flogo img{
width:80%;
max-width:300px;
}


div#footer div#fInfo a.telink{
margin:0 0 10px;
display: inline-flex;
align-items: center;
justify-content: center;
}

section#info{
display:flex;
justify-content:center;
padding:3rem 0;
width:100%;
text-align:center;
overflow:hidden;
margin: 0 auto;
box-sizing:border-box;
background:#baeee0;
}
section#info > div{
display:flex;
flex-direction:column;
align-items:center;
max-width:480px;
width:48%;
overflow: hidden;
text-align:left;
vertical-align:top;
box-sizing:border-box;
padding:1.4rem;
background:rgba(255,255,255,0.8);
}
section#info >div p{
width:100%;
text-align:center;
margin:0 0 0.4rem;
}
section#info >div p.ttl{
font-size:1.2rem;
margin:0 0 0.6rem;
}
section#info >div p.ttl i{
color:#927864;
}

section#info > div.calendar .calnotice, .content-cal .calnotice{
text-align:justify;
letter-spacing:0;
margin:0 0 0.2rem;
line-height:1.6;
display:block;
width:100%;
}
section#info > div.contact{
border-left:2px dashed #faf0d3;
}

section#info >div.mapcol{
max-width:calc(960px + 2% );
width:100%;
margin-bottom:0;
}

section#info >div p.transit{
text-align:left;
}


#info .contact p a{
display:flex;
align-items:center;
justify-content:center;
border-radius: 6px;
color:#59493d;
box-sizing:border-box;
}
#info .contact p a.telink{
font-size:1.4rem;
}
a.telink i{
color:#4abf9e;
}




#info iframe{
width:100%;
min-height:300px;
border-radius:6px;
}

#map{
border:none;
border-radius:6px;
height:440px;
width:100%;
margin: 0 0 20px 0;
}



.accessInfo{
padding:0.6rem;
box-sizing:border-box;
margin:0;
}
.accessInfo p{
margin:0 0 10px;
text-align:left;
}
.accessInfo p i{
color:#FFBCD1;
}


p.backtotop a{
bottom:0.2rem;
right: 0.2rem;
overflow: hidden;
position: fixed;
margin:0;
text-align:right;
opacity:0.7;
font-size:1rem;
width:60px;
height:60px;
box-sizing:border-box;
display:flex;
justify-content:center;
align-items:center;
border-radius:4px 0 0 0;
}
p.backtotop a:hover{
opacity:1;
}
p.backtotop a i{
margin:6px;
color:#FFBCD1;
}

.fresv div{
display:inline-block;
text-align:center;
margin:0 0 10px;
padding:0;
background:rgba(255,255,255,0.7);
border-radius:6px;
box-shadow:0 1px 2px 0 #bebebe;
box-sizing:border-box;
vertical-align:top;
width:100%;
}

.fresv div p{
margin:0 0 4px 0;
padding:6px 10px;
line-height:1.4;
}
.fresv div p.type{
background:#00A63C;
white-space:nowrap;
color:rgba(255,255,255,0.7);
border-radius:6px 6px 0 0;
}

.fresv p:not(.tel) i{
color:rgba(255,255,255,0.7);
}

.fresv p.tel{
text-align:right;
margin:0 0 6px 0;
font-size:26px;
}

.fresv div .btn{
border-radius:6px;
background:#FDF1D6;
border:1px solid #fce6b8;
margin:10px;
}
.fresv div .btn a{
display:block;
padding:8px 10px;
}

table.cal{
margin:0 0 0.4rem;
width: 100%;
border-collapse: separate;
border-right: 1px solid #CCCCCC;
border-bottom: 1px solid #CCCCCC;
border-spacing: 0;
}
table.cal th{
padding:0.8rem 0.4rem;
background:#eee;
border-top: 1px solid #CCCCCC;
border-left: 1px solid #CCCCCC;
text-align:center;
width:20%;
line-height:1.6;
font-weight:bold;
vertical-align:middle;
text-align:center;
}
table.cal td{
padding:0.8rem 0.4rem;
background:rgba(255,255,255,0.7)FFF;
border-top: 1px solid #CCCCCC;
border-left: 1px solid #CCCCCC;
line-height:1.6;
text-align:center;
vertical-align:middle;
}


/* ------------------------------------------------------------------
home
 ------------------------------------------------------------------ */

.single{
width:40px;
margin:0 0 1rem;
}

#content-top section#feature{
text-align:center;
padding: 2rem 0 1rem;
background:#FFBCD1;
background: linear-gradient(to bottom,  #ffe0e9 0%,#ffbcd1 70%,#ffbcd1 100%);
}
#feature h2{
color:rgba(255,255,255,0.9);
margin:2rem 1rem 3rem;
font-size:1.3rem;
display: inline-flex;
justify-content:center;
align-items:center;
flex-wrap:wrap;
}
#feature h2:after{
padding:0.6rem 0 0;
content: url("../img/common/logo-notxt.png");
width:100%;
transform: scale(0.8);
opacity:0.8;
}
#feature h2 .cc{
font-size:110%;
}
#feature .inner{
width:100%;
box-sizing:border-box;
display:flex;
flex-direction:column;
align-items:center;
max-width:none;
}

#feature .introcol{
max-width:900px;
margin:0 2rem;
display:flex;
flex-wrap:wrap;
justify-content:space-around;
}

#feature .introcol .showlogo{
max-width:200px;
width:50%;
opacity:0.6;
margin:0 auto 2rem;
}

.case{
display:flex;
flex-wrap:wrap;
justify-content:space-around;
margin:0 auto 40px;
max-width:700px;
}
.case div{
width:50%;
display:flex;
flex-direction:column;
align-items:center;
box-sizing:border-box;
padding:10px;
}
.case p{
text-align:center;
margin:0;
line-height:1.4;
}
.case p img{
display:block;
box-sizing:border-box;
padding:10px;
}
.case p:first-of-type{
background:rgba(255,255,255,0.4);
border-radius:50%;
text-align:center;
}

#feature .btn{
width:100%;
margin:3rem 0;
}
#feature .btn a{
background:#FFBCD1;
}
#feature .btn a, #feature .btn i{
color:#fff;
}

#content-top section#subject{
position:relative;
padding:0 0 3rem;
background-size: auto auto;
background-color: rgba(198, 163, 137, 1);
background-image: repeating-linear-gradient(0deg, transparent, transparent 6px, rgba(195, 159, 132, 1) 6px, rgba(195, 159, 132, 1) 12px );
}
#subject h2{
padding:3rem 0;
color:#fff;
margin:0 0 3rem ;
background:#927864;
}
#subject h3{
padding:0.6rem 1rem;
margin:1rem 0 0.2rem;
display:block;
width:100%;
}
#subject i{
color:#927864;
opacity:0.8;
}
#subject a.sbjox:nth-of-type(n+1) h3{
background:#F4B2BA;
}
#subject a.sbjox:nth-of-type(2n) h3{
background:#EAD578;
}


#subject p{
text-align:center;
}
#subject .sbjox > div{
margin:1rem;
background:rgba(255,255,255,0.6);
padding:0.8rem;
height:36%;
display:flex;
align-items:center;
}

.sbjinner{
position:relative;
display:flex;
flex-wrap:wrap;
justify-content:center;
margin:0 auto 3rem;
max-width:1200px;
}
.sbjinner h2{
margin:0 0 1rem;
}

.sbjox{
display:flex;
flex-direction:column;
align-items:center;
justify-content:space-between;
width:calc( 100% /4 );
background:rgba(255,255,255,0.9);
box-sizing:border-box;
margin:0.4rem 0;
height:400px;
}

#subject .sbjox h3 +p{
margin:0 0.2rem 0.6rem;
}
#subject .sbjox p{
text-align:justify;
letter-spacing:0;
margin:0;
display:flex;
flex-wrap:wrap;
justify-content:center;
line-height:1.6;
}

#subject #sbj01{background:url("../img/top/subject01.jpg") 50% 50% / cover;}
#subject #sbj02{background:url("../img/top/subject02.jpg") 50% 50% / cover;}
#subject #sbj03{background:url("../img/top/subject03.jpg") 50% 50% / cover;}
#subject #sbj04{background:url("../img/top/subject04.jpg?2205") 50% 0% / cover;}


#subject p.btn a{
background:rgba(255,255,255,0.7);
border:1px solid #927864;
}
#subject p.btn a, #subject p.btn a i{
color:#444;
}


#content-top section#greeting{
text-align:center;
background:#fff;
}
#content-top section#greeting .inner{
max-width:900px;
display:flex;
flex-direction:column;
justify-content:center;
flex-wrap:wrap;
}

#greeting .gcol{
display:flex;
justify-content:space-between;
align-items:center;
background:rgba(255,255,255,0.9);
padding:1rem 1rem 0;
}
#greeting .gcol + .gcol{
border-top:1px dashed #927864;
}
#greeting .gcol .gcolimg{
width:30%;
}
#greeting .gcol .gcoltxt{
width:70%;
padding:1rem;
}


#greeting .inner .doctorphoto{
padding:0;
background:#f0f0f0;
margin:0 auto;
}
#greeting .inner p{
padding:0;
margin:0;
}
#greeting .inner p{
padding:1rem;
}

#greeting .inner .btn, #greeting .btn{
text-align:center;
padding:0;
}
#greeting .inner .btn a{
width:60%;
background:#56c1a3;
}


.notice{
background: #f0f0f0;
border-radius: 1rem;
padding:1rem;
}

#access + section#accessinfo{
display:none;
}

section#accessinfo{
background:url("../img/common/halftone.png") 0 0;
text-align:center;
display:flex;
flex-direction:column;
justify-content:center;
padding:3rem 0;
}
section#accessinfo .inner{
max-width:900px;
width:90%;
}
section#accessinfo .inner p{
margin:0;
}
section#accessinfo .transport{
width:auto;
}

#content-top section#news {
text-align:center;
padding:1rem;
background:url("../img/top/cream_pixels.png") 0 0;
}
#news h2{
color: #444;
display:block;
width:100%;
margin:1rem auto 2rem;
max-width:1100px;
}

#news h3{
text-align:left;
margin:0;
color:#4abf9e;
padding:0 0 0.4rem;
}
#news .inner{
height:40vh;
margin:0 auto;
padding:1rem;
border-radius:2px;
display:flex;
flex-wrap:wrap;
background:rgba(255,255,255,0.8);
}

.mCustomScrollBox{
width:100%;
}
.mCS-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCS-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar:hover{
background:#74c6be;
border-radius:0.4rem;
}
.mCS-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar, .mCS-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, .mCSB_draggerContainer:hover .mCSB_dragger .mCSB_dragger_bar, .mCSB_dragger:hover .mCSB_dragger_bar, .mCS-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar, .mCS-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, .mCS-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar{
background:#74c6be;
}

#news .inner .mCSB_container div{
padding:1.2rem 0.6rem 0.6rem;
box-sizing:border-box;
width:100%;
margin:0 0 0.6rem;
}
#news .inner .mCSB_container div{
border-bottom:1px dashed #bebebe;
}
#news .inner .mCSB_container div:empty {
display:none;
}

#news .linkbtn{
background:#f0f0f0;
display:inline-block;
padding:0.4rem 1rem;
border-radius:0.2rem;
margin: 0 0 0.4rem;
}

#news p{
text-align:left;
letter-spacing: 1px;
padding:0 0 0.4rem;
margin:0;
line-height: 1.6;
}
#news p.btn{
border-bottom:none;
margin:1rem 0 4rem;
text-align:center;
}

#news p.calnote, p.calnote{
border:none;
text-align:center;
color: #05afb6;
}



#news p span.new:before{
display:inline-block;
width:60px;
margin-right:4px;
text-align:center;
box-sizing:border-box;
background:#257CBE;
color:rgba(255,255,255,0.7);
border-radius:6px;
padding:2px 4px;
content:"NEW";
}

#news .instagram{
width:100%;
text-align:right;
}
#news .instagram a{
border:1px solid #d2b25b;
border-radius:4px;
background:rgba(255,255,255,0.7);
padding:0.6rem;
}

#news .inner div.gcal{
margin:1rem 0;
padding:0;
height:600px;
}







/* ------------------------------------------------------------------
content
------------------------------------------------------------------ */

main#staff h2,main#fee h2{
align-items:center;
border-bottom:1px dashed #7c7358;
}
main#staff h2 i{
color:#bfb187;
}
main#staff h4 i, main#access h2 i{
color:#8cdbc3;
}

main#staff .photo{
max-width:270px;
padding:1rem 0;
}


.icon{
display:inline-block;
vertical-align:bottom;
text-align:center;
height: 40px;
line-height: 40px;
width: 40px;
box-sizing:border-box;
background:#8cdbc3;
border-radius:50%;
padding:0;
color:#fff;
margin:0 10px 0 0;
}


.accessmap{
margin:0 auto;
width:50%;
}
.accessmap p{
margin:0;
}
.transport{
width:50%;
padding:1rem 1rem 0;
}
.transport p{
text-align:left;
margin:0;
}
.transport p.address{
margin:0 0 1rem;
}


.accessinfo{
box-sizing:border-box;
background:rgba(255,255,255,0.8);
padding:0;
border-radius:6px;
}
.accessinfo p{
margin:0 0 0.4rem;
letter-spacing:1px;
text-align:left;
}
.accessinfo p:last-child{
margin:0;
}

.parking{
text-align:center;
}
.parking img{
max-width:600px;
}


#map, #mapaccess{
	border:1px solid #c0c0c0;
	border-radius:6px;
	height:480px;
	margin: 0 0 20px 0;
}

