.pc { display: block !important; }
.sp { display: none !important; }


.br-pc{
                                display: block;
}
.br-sp{
                                display: none;
}


body{
	font-size: 1.0em;
                                font-family: "ipafont","ipaexgs","ipa","awesome","ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}


#header{
	height:auto;
                                padding:1rem 2rem;
	border-bottom:1px solid #4d4d4d;
}

#logo{
	margin:0 auto;
                                font-size:150%;
                                font-weight:700;
                                letter-spacing:0.1rem;
                                color:#55b650;
}

#wrapper{
	width:stretch;
	padding:1rem 0.5rem;
	margin:0 auto;
}
.wrapper-in{
                                width:stretch;
	max-width:1180px;
	padding:0;
	margin:0 auto;
}
.booking-container{
                                padding-bottom:1.0rem;
}
.booking-container .request{
                                padding-left:1.2rem;
                                position: relative;
}
.booking-container .request::before{
                                content: ""; /* 必須 */
                                position: absolute;
                                left: 0;
                                top:0.5rem;
                                width: 0.8rem;  /* アイコン幅 */
                                height: 0.8rem; /* アイコン高さ */
                                background-color: #b6dd92;
                                border-radius: 50%; /* 幅と高さの半分で正円にする */
                                box-sizing: border-box;
}
.inner-container{
                                border:1px solid #cccccc;
                                padding:0rem 1rem 0.5rem 1rem;
}
.inner-container-title{
                                background-color:#55b650;
                                margin-top:0.5rem;
                                color:#fff;
}
.booking-container .inner-container .request{
                                padding-top:0.4rem;
                                padding-left:0.8rem;
                                position: relative;
}
.booking-container .inner-container .request::before{
                                content: ""; /* 必須 */
                                position: absolute;
                                left: 0;
                                top:1.1rem;
                                width: 0.5rem;  /* アイコン幅 */
                                height: 0.5rem; /* アイコン高さ */
                                background-color: #555;
                                border-radius: 50%; /* 幅と高さの半分で正円にする */
                                box-sizing: border-box;
}
.booking-container .price{
                                display:flex;
                                padding:0.8rem 1rem 0.5rem 1rem;
                                background-color:#f2f2f2;
                                border-bottom:3px double #999;
}
.booking-container .price div{
                                width:calc(100%/2);
}
.booking-container .agree{
                                padding:0.8rem 1.2rem;
                                border:1px solid #aaa;
}
.booking-container .agree .agree-item{
                                position: relative;
                                padding-left: 1.3rem;
                                margin: 0.75em 0;
}
.booking-container .agree .agree-item .agreement{
                                position: absolute;
                                left:0;
                                top: 0.5em;
                                inline-size: 1rem;
                                block-size: 1rem;
}


/* フォントの位置と色 
==============================*/

p {
	line-height:1.8;
}
.red{
	color:#ff0000;
}
.center{
	text-align:center;
}
.right{
	text-align:right;
}

.hanrei-maru{
                                color:#ef8ea4;
                                font-weight:700;
}
.hanrei-sanaku{
                                color:#666;
                                font-weight:700;
}
.hanrei-batsu{
                                color:#b5b5b6;
                                font-weight:700;
}
.hanrei-fuka{
                                color:#b5b5b6;
                                font-weight:700;
}
.green{
                                color: #55b650;
}

/* フォントサイズ 
==============================*/
.font-l{
	font-size:1.1em;
}
.font-l2{
	font-size:1.2em;
}
.font-l3{
	font-size:1.3em;
}
h1{
	font-size:22px;
	font-weight:bold;
	border-bottom:2px solid #b7c6e0;
	padding-left:10px;
	margin-bottom:20px;
}
.font-b{
                                font-weight:bold;
}
.req{
                                font-size:86%;
                                color:#e08205;
                                font-weight:600;
}
.booking-num{
                                margin:1rem ;
                                padding:1rem 2rem;
                                border:1px solid red;
                                font-weight:600;
}

/* 余白
==============================*/
.mar-tb5{
                                margin:0.5rem 0; 
}
.mar-tb10{
                                margin:1.0rem 0; 
}
.pad-tb10{
                                padding:1.0rem 0; 
}
.pad-b10{
                                padding-bottom:1.0rem; 
}

/* footfooter
==============================*/
#footer {
	width:100%;
                                display:flex;
                                background-color:#f0f7e8;
}
#footer .col1{
                                width:100%;
                                max-width:1180px;
                                padding:1rem;
	margin:0 0.5rem;
}
#footer .col2{
                                width:calc(100%/2);
                                max-width:1180px;
                                padding:1rem;
	margin:0 0.5rem;
}
#footer .col3{
                                width:calc(100%/3);
                                max-width:1180px;
                                padding:1rem;
	margin:0 0.5rem;
}
#footer .copyright {
	padding-top: 10px;
	font-size: 11px;
}
.torikeshi {
	width:100%;
                                padding:1rem;
                                text-align:right;
                                box-sizing:border-box;
}

/*　水平線
==============================*/
hr.normal-gray{
                                margin:0;
                                height: 1px;
                                background-color: #cdcdcd;
                                border: none;
}

/* リストデザイン
==============================*/
ul{
                                margin:1rem 0;
                                padding-left:1.5rem;
}
ul li{
                                list-style-type: square;
                                margin:0.5rem 0;
}

/* ボタンデザイン
==============================*/
.btn-foot-default{
                                color:#fff;
	background: -moz-linear-gradient(top, #96cf65, #55b650);
	background: -webkit-linear-gradient(top, #96cf65, #55b650);
	background: linear-gradient(to bottom, #96cf65, #55b650);
	border:0;
	padding:0.3rem 1.5rem;
	font-size:90%;
                                border-radius:3px;
                                cursor: pointer;
}
#btn-submit:disabled{
                                cursor:not-allowed;
                                opacity:0.6;
}
.torikeshi input[type="button"]{
                                color:#fff;
	background: -moz-linear-gradient(top, #ccc, #888);
	background: -webkit-linear-gradient(top, #ccc, #888);
	background: linear-gradient(to bottom, #ccc, #888);
	border:1px solid #888;
	padding:0.3rem 1.5rem;
	font-size:14px;
}

/*アコーディオンボタン
==============================*/
#acMenu{
                                margin-bottom:1rem;
}
#acMenu dt{
	display:block;
                                width:15rem;
	height:1rem;
                                padding: 0.5rem 1rem;
                                margin: 5px 0 0;
	line-height:1rem;
	text-align:left;
                                background: linear-gradient(to bottom, #96cf65, #55b650);
                                border-radius:3px;
                                color:#fff;
	cursor:pointer;
	}
#acMenu dd{
	background:#f2f2f2;
	max-width:1240px;
	height:auto;
                                padding: 10px 20px 10px;
	line-height:50px;
	text-align: left;
	display:none;
	}
#acMenu dt.active{
                                background: linear-gradient(to bottom, #96cf65, #55b650);
}

/* ボックスデザイン
==============================*/
.graybox{
                                background-color:#f2f2f2;
                                padding:0.5rem;
}
.graylinebox{
                                border:1px solid #cccccc;
                                padding:0.5rem;
}


/* カレンダーカスタマイズ
==============================*/
.ui-widget.ui-widget-content{
                                margin:0 auto;
}
.ui-datepicker .ui-datepicker-header{
                                background:#fff !important;
                                border-top:#fff;
                                border-left:#fff;
                                border-right:#fff;
                                border-radius:0;
}
.ui-state-active, .ui-widget-content .ui-state-active{
                                border:1px solid #d3d3d3!important;
}
.ui-state-default, .ui-widget-content .ui-state-default{
                                background:none !important;
                                padding-bottom:2rem;
}
.ui-state-highlight, .ui-widget-content .ui-state-highlight{
                               /* background-color:none!important;*/
                                background-color:#fffaa3!important;
}
.ui-state-highlight a, .ui-widget-content .ui-state-highlight a{
                                border:0px solid #c8ecff!important;
                                background:none;
}
.maru a:hover, .sankaku a:hover, .batsu a:hover{
                                background-color:rgba(2,167,252,0.1)!important;
}
.maru{
                                background:url(../img/maru.png)no-repeat center 2rem;
}
.batsu{
                                background:url(../img/batsu.png)no-repeat center 2rem;
}
.sankaku{
                                background:url(../img/sankaku.png)no-repeat center 2rem;
}
.fuka{
                                background:url(../img/fuka.png)no-repeat center 2rem;
}
.yasumi{
                                background:url(../img/fuka.png)no-repeat center 2rem;
}
.batsu a.ui-state-active,.batsu a.ui-state-default{                               
                                background:url(../img/batsu.png)no-repeat center 2rem;
                                pointer-events:none!important;
                                border:1px solid #d3d3d3;
}
.ui-widget-header a{
                                background:#f2f2f2 !important;
                                color:#fff !important;
}

/* フォームカスタマイズ
==============================*/
textarea{
                                width:100%;
                                max-width:800px;
                                min-width:500px;
}
select{
                                padding: 0.1rem 0.2rem;
                                margin: 0.2rem 0;
                                font-size: 100%;
                                background:#fff;
                                border:1px solid #aaa;
}
input[type="checkbox"]:disabled,input[type="radio"]:disabled{
                                cursor: not-allowed;
}
input[readonly] {
                                background-color: #f5f5f5;
                                border:1px solid #d3d3d3;
                                border-radius:2px;
}
.disabled{
                                opacity:0.5;
}
.booking-container label{
                                padding-right:0.2rem;
}
.booking-container input[type="radio"],.booking-container input[type="checkbox"]{                
                margin-right:0.1rem;
}

/* 施設予約
==============================*/
.shisetsu-container{
                                background-color:#f6f6f6;
                                padding:0 1rem;
}

/* タイムピッカー
==============================*/
.aac-timepicker{
                                display:flex;
                                padding-bottom:1.0rem;
}
/*.aac-timepicker div:last-child{
                                 border-right: 1px solid #8b98a5;
}*/
.aac-timepicker input[type="checkbox"]{ 
                                appearance: none;
                                height: 36px;
                                width: 48px;
                                margin: 0;
                                border-top: 1px solid #8b98a5;
                                border-bottom: 1px solid #8b98a5;
                                border-left: 1px solid #8b98a5;
                                border-radius: 0px;
}
.timeselect{
                                background-color: #fff;
                                cursor: pointer;
}
.timeselect:checked{
                                border: 1px solid #8b98a5;
                                background-color: #1d9bf0;
}
.time{
                                display:block;
                                font-size:80%;
}
.time-end{
                                display:block;
                                height: 36px;
                                font-size:80%;
                                border-left: 1px solid #8b98a5;
}
.timeselect:disabled{
                                background-color: #cfcfcf;
}

/* アコーディオン
===============================*/
.accordion-green {
    margin-bottom: 7px;
}

.accordion-green summary {
    display: flex;
    justify-content: space-between;
    align-items: center;
    position: relative;
    padding: 1em 2em;
    color: #fff;
    font-weight: 700;
    cursor: pointer;
    background-color: #55b650;
    border-radius: 5px;
}

.accordion-green summary::-webkit-details-marker {
    display: none;
}

.accordion-green summary::after {
    transform: translateY(-25%) rotate(45deg);
    width: 7px;
    height: 7px;
    margin-left: 10px;
    border-bottom: 3px solid #fff;
    border-right: 3px solid #fff;
    content: '';
    transition: transform .3s;
}

.accordion-green[open] summary::after {
    transform: rotate(225deg);
}

.accordion-green ul {
                                transform: translateY(-10px);
                                opacity: 0;
                                margin: 0;
                                padding: .3em 2em 1.5em;
                                transition: transform .5s, opacity .5s;
}

.accordion-green[open] ul {
                                transform: none;
                                opacity: 1;
                                border-left:1px solid #999;;
                                border-right:1px solid #999;;
                                border-bottom:1px solid #999;;
}
.accordion-green[open] ul li{
                                list-style-type:none;
}