@charset "UTF-8";
@import url(http://fonts.googleapis.com/earlyaccess/notosansjapanese.css);
@import url('https://fonts.googleapis.com/css?family=Kosugi+Maru&display=swap&subset=japanese');
@import url('https://fonts.googleapis.com/css?family=Noto+Sans+JP:300,400,500,700,900|Noto+Serif+JP:300,400,500,600,700,900|PT+Serif:400,700&display=swap');
/* --------------------------------------------------
 Base
-------------------------------------------------- */
body,ol,ul,dl,li,dt,dd,table,th,td,input,textarea,select,h1,h2,h3,h4,h5,h6{
color:#5C5C5C;
font-weight:normal;
font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}
h1,h2,h3,h4,h5,h6, .btnDetail , .telTxt , .telNumber , .sform_btn{
font-family:"Noto Serif JP" ,sans serif;
}

body{
background: #e6e6e6;
min-width:320px; 
text-align:center;
line-height:180%;
font-size:14px;
word-wrap:break-word;
border-top: 3px solid #ffabcd;
}

input{
padding:2px;
}

textarea{
padding:3px;
}

ol{
margin:0px 0px 0px 21px;
}

ol > li{
list-style:decimal outside;
margin:0px 0px 10px;
}

a:link,
a:visited{
color:#34BA7D;
text-decoration:underline;
}

a:hover,
a:active{
color:#398885;
text-decoration: none;
}

em{
font-style:normal;
font-weight:bold;
color:#f39700;
}

strong{
font-style:normal;
font-weight:bold;
}

/* --------------------------------------------------
 Wrapper
-------------------------------------------------- */
#wrapper{
margin:0px auto;
text-align:left;
overflow:visible;
}
#contents {
	max-width:750px;
	margin: 0 auto;
}
#rightArea {
	max-width:750px;
}
#sub #rightArea h1 {
	margin:4% 0;
}
#sub #rightArea h2 {
	margin-bottom: 40px;
}
#leftArea {
	float:left;
	width:240px;
	background:#fff;
	position:relative;
	z-index:2;
	margin-top: -390px;
	text-align:center;
	padding-top: 20px;
	margin-left: -20px;
}
#sub #leftArea {
	margin-top:-10px;
}
#leftArea h2 + p {
	margin-top: 25px;
	padding-bottom: 45px;
	background:url(../img/common/heart_line.jpg) no-repeat bottom center;
}
#gra {
height:50px;
background: rgb(255,255,255);
background: linear-gradient(to bottom, rgb(255,255,255) 0%,rgb(230,230,230) 100%);
}
/* --------------------------------------------------
 Header
-------------------------------------------------- */
#sub #header{
	position:relative;
	overflow:visible;
}
#sub #headWrap h1 {
	margin: 0 auto;
	padding: 10px;
	
}


/* --------------------------------------------------
 Navigation
-------------------------------------------------- */
#leftArea nav {
	width:200px;
	margin: 0 auto;
}
#leftArea nav li {
	text-align:left;
	position: relative;
	height: 58px;
	border-bottom: 1px dotted #ddd;
	background:url(../img/common/arrow_off.jpg) no-repeat 0px 23px;
}
#leftArea nav li a {
	position:absolute;
	padding-left: 10px;
	line-height:58px;
	display:block;
	top: 0;
	left:0;
	width:100%;
	color:#777;
	text-decoration:none;
}
#leftArea nav li a.honer {
	color:#777;
}
#leftArea nav li.current,
#leftArea nav li:hover {
	background:url(../img/common/arrow.jpg) no-repeat 0px 23px;
}
/* --------------------------------------------------
 Footer
-------------------------------------------------- */
footer{
	clear: both;
	margin: 0px 0px 0px;
	text-align: left;
	overflow: visible;
	border-top : 1px solid #fff;
}

/* ロゴ --------------- */
footer .logo{
margin:0px 0px 10px;
}
footer .inner {
	max-width: 750px;
	margin: 0 auto;
	display: block;
	position: relative;
	text-align: center;
}
footer #footInfo {
	padding: 0 4%;
	display: block;
	overflow: hidden;
	margin-bottom: 5%;
}
footer #footInfo h3 {
    padding: 40px 0 30px 0;
    border-bottom: 3px solid #fff;
    max-width: 315px;
    overflow: hidden;
    margin: auto auto 30px;
}
#footInfo img , #footerNav li img {
    max-width: 100%;
}

/* ナビ --------------- */
#footerNav {
	padding: 0 4%;
	display: block;
	overflow: hidden;
}
#footerNav ul {
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
}
#footerNav li {
    float: left;
    margin-right: 4%;
    margin-bottom: 2%;
    width: 35%;
}
#footerNav li:nth-child(2n+2) {
    margin-right: 0;
}
#footerNav li a {
	box-shadow: 1px 1px 3px #cecece;
	display:inline-block;
}


/* コピーライト --------------- */
footer .copyright{
padding:10px;
font-size: 11px;
color: #fff;
font-size:12px;
margin-top: 30px;
background:#8fd1da;

}

footer .copyright span{
	display:block;
	max-width:750px;
	margin: 0 auto;

}
/* --------------------------------------------------
 Page Top
-------------------------------------------------- */
#btmPageTop{
position:fixed;
bottom: -40px;
right:0px;
z-index: 999;
}

#btmPageTop a{
display: block;
	width: 100px;
	height: 38px;
	background-color: #5FDBB9;
	border-radius: 5px 0px 0 0;
	text-align: center;
	color: #fff;
	font-size: 14px;
	text-decoration: none;
	line-height: 38px;
	}

aside {
	margin: 15px 0;
}
#sContact{
	width: 94%;
	padding: 3%;
	background: #fff;
	border-radius: 4px;
}
#sContact h3 {
	text-align: center;
}
#sub #sContact h3 {
	margin-bottom: 15px;
}
#sContact li {
	float:left;
	width:100%;
	text-align: center;
}
#sContact li:nth-of-type(2n) {
	margin-top: 9px;
	text-align:center;
}
#sub #sContact li:nth-of-type(2n) {
	margin-top: 25px;
}

#sContact li dt {
	margin-bottom: 15px;
}
#sub #sContact li dt {
	margin-bottom: 5px;
}
#sub #sContact li dt + dd {
	margin-bottom: 10px;
}

/* --------------------------------------------------
drawer
-------------------------------------------------- */
#drwNavTrigger {
display: none;
}
.drwNavBtn {
position: fixed;
top: 4px;
right: 12px;
display: none;
width: 40px;
height: 40px;
text-align: center;
cursor: pointer;
z-index: 993;
}

  .drwNavBtn {
  display: block;
  }

.drwNavBtnBar {
position: absolute;
top: 0;
left: 0;
display: block;
width: 35px;
height: 2px;
background: #333;
transition: all 0.4s;
transform-origin: left top;
}
#drwNavTrigger:checked ~ .drwNavBtn .drwNavBtnBar {
box-shadow: none;
}
.drwNavBtnBar.top {
top: 10px;
left: 5px;
}
.drwNavBtnBar.middle {
top: 20px;
left: 5px;
opacity: 1;
}
.drwNavBtnBar.bottom {
top: 30px;
left: 5px;
transform-origin: left bottom;
}
#drwNavTrigger:checked ~ .drwNavBtn .drwNavBtnBar.top {
width: 30px;
left: 11px;
transform: rotate(45deg);
}
#drwNavTrigger:checked ~ .drwNavBtn .drwNavBtnBar.middle {
opacity: 0;
}
#drwNavTrigger:checked ~ .drwNavBtn .drwNavBtnBar.bottom {
width: 30px;
left: 11px;
top: 31px;
transform: rotate(-45deg);
}
.drwNavBtnText {
position: absolute;
bottom: -13px;
left: 5px;
right: 0;
margin: auto;
transition: all 0.3s;
display: block;
visibility: visible;
opacity: 1;
letter-spacing: 0;
color: #333;
font-size: 10px;
}
#drwNavTrigger:checked ~ .drwNavBtn .drwNavBtnText {
visibility: hidden;
opacity: 0;
}
.drwNavClose {
position: fixed;
top: 0;
right: 300px;
width: 100%;
height: 100vh;
background: rgba(0,0,0,0);
cursor: url(../img/common/close_cross.png),auto;
transition: all 0.4s;
visibility: hidden;
opacity: 0;
}
#drwNavTrigger:checked ~ .drwNavClose {
transition: all 0.4s 0.3s;
background: rgba(0,0,0,0.6);
visibility: visible;
opacity: 1;
z-index: 993;
}
#drwNav {
box-sizing: border-box;
position: fixed;
top: 0;
right: 0;
width: 300px;
height: 100%;
background: #fff;
transition: all 0.4s;
opacity: 0;
overflow: hidden;
transform-origin: right center;
transform: translateX(300px);
}
#drwNavTrigger:checked ~ #drwNav {
transition-delay: 0.3s;
transform: none;
opacity: 1;
z-index: 992;
}
.drwNavInner{
box-sizing: border-box;
width: 100%;
min-width: 250px;
height: 100%;
padding: 5% 4% 15%;
overflow-x: hidden;
overflow-y: scroll;
}
#drwNav .logo{
margin: 0 20px 20px;
}
#drwNav .logo a{
text-decoration: none;
}
#drwNav .logo .img{
display: block;
text-align: center;
margin: 20px 0 12px;
}
#drwNav .logo .img img{
width: 50px;
}
#drwNav .logo .txt01{
display: block;
font-size: 12px;
margin: 0 0 10px;
}
#drwNav .logo .txt02{
display: block;
font-size: 12px;
}
#drwNav .logo .txt03{
display: block;
font-size: 18px;
font-weight: 900;
text-align: center;
font-style: italic;
}
#drwNav .globalNav{
box-sizing: border-box;
margin: 0 auto;
width: 100%;
}
#drwNav .globalNav > ul li a,
#drwNav .globalNav .accordionWrap .accordionTrigger{
display: block;
text-decoration: none;
position: relative;
padding: 12px 7%;
transition: all 0.3s;
/*border-bottom: #fff solid 1px;
background: #000;*/
color: #fff;
width: 100%;
}
/*#drwNav .globalNav > ul > li:nth-of-type(1) > a{
border-top: #fff solid 1px;
}*/
#drwNav .globalNav .accordionWrap .accordionTrigger:after{
font-family: "Font Awesome 5 Free";
content: '\f105';
font-weight: 900;
font-size: 14px;
color: #fff;
position: absolute;
right: 5%;
transform: rotate(90deg);
transition: 0.2s;
}
#drwNav .globalNav .accordionWrap .accordionTrigger.onclick:after{
transform: rotate(270deg);
}
#drwNav .globalNav .accordionContent li a{
padding-left: 12%;
background: #333;
}
#drwNav .tel{
margin: 20px 20px 0;
}
#wrapper {
    box-sizing: border-box;
    position: relative;
    transition: all 0.4s 0.3s;
}
#drwNavTrigger:checked ~ #wrapper {
transition-delay: 0s;
transform: translateX(-300px);
}