@charset "utf-8";
/* CSS Document */
* {box-sizing: border-box;}
.pc { display: none;}
.sp { display: block;}
img {width: 100%; height: auto; max-width: 100%;}
.img_right {float: none; width: 100%; margin: 0;}
.img_right iframe {width: 100%;}

#container {width: 100%;}
#contents {width: 100%;}
#Main, #side {width: 100%; float: none;}
#footer {height: auto;}
#footer ul {width: 100%; float: none;}
#footer_left {float: none; width: 100%;}
#footer_map {width: 100%; float: none;}
#col03 {float: none; width: 100%;}

body {background: #fff;}
#header h1, #header #tel , #GlobalNav {display: none;}
#header {padding: 0 4vw; height: 16vw; width: 100%; position: sticky; left: 0; top: 0; background: #fff; z-index: 100;}
#header #logo {float: none; width: 40vw;}

.sp-btnTel {position: absolute;	width: 11vw;	height: 11vw;	right: 14vw;	top: 2vw;	z-index: 100;	background: #F8B500; display: flex;	display: -webkit-flex;	justify-content: center;	align-items: center; }
.sp-btnTel span {color: #fff; font-size: 6vw; line-height: 1;}

#btnGlobal {position: absolute;	width: 11vw;	height: 11vw;	right: 2vw;	top: 2vw;	z-index: 200;	background: #9dc441;	display: flex;	display: -webkit-flex;	justify-content: center;	align-items: center;}
#btnGlobal .btnWrapGlobal {	position: relative;	width: 5vw;	height: 4vw;}
#btnGlobal .btnLine { height: 2px; background: #fff; position: absolute; right:0; width: 100%;}
#btnGlobal .btnLine.btnLineT {  top: 0;}
#btnGlobal .btnLine.btnLineM { top: 50%; transform: translateY(-50%);}
#btnGlobal .btnLine.btnLineB { bottom: 0; }
#btnGlobal.active .btnLine {background: #fff;}
#btnGlobal.active .btnLine.btnLineT { display: none;}
#btnGlobal.active .btnLine.btnLineM { transform: translateY(0) rotate(45deg) ;}
#btnGlobal.active .btnLine.btnLineB { transform: rotate(-45deg); bottom:inherit; top: 50%;}
#btnGlobal .btnLine.btnLineM, #btnGlobal .btnLine.btnLineB {-moz-transition: all, ease-in-out, 0.3s;  -o-transition: all, ease-in-out, 0.3s;  -webkit-transition: all, ease-in-out, 0.3s; transition: all, ease-in-out, 0.3s;}
#grandMenu {background: rgba(0,0,0,0.8); width: 100%; height: 100%; position: fixed; z-index: 100;  left: 0; top: 0; display: none; overflow: auto; padding: 20vw 8%;}
#grandMenu a {color: #fff;}
#grandMenu .spWrapGM {display: flex; display: -webkit-flex; flex-direction: column-reverse; padding: 20vw 8% 10vw;}
#grandMenu #navGlobal li { font-size: 4.2vw; border-bottom: 1px dotted #888; line-height: 1;}
#grandMenu #navGlobal li a {display:  block; padding: 4vw 0; position: relative; text-decoration: none;}
#grandMenu #navGlobal li a::after {content:""; position: absolute; right: 2vw; top: 50%; width: 2vw; height: 2vw; border-top:1px solid #fff; border-right: 1px solid #fff; transform:  rotate(45deg) translateX(-50%);}
#grandMenu #navGlobal li.btn-navChild a::after { transform:  rotate(135deg);}
#grandMenu #navGlobal li.btn-navChild .sp-navChild {display: none;}
#grandMenu #navGlobal li.btn-navChild .sp-navChild  li {border-bottom: none; font-size: 4vw; padding-left: 3.7vw; float: none;}
#grandMenu #navGlobal li.btn-navChild .sp-navChild a::after {content: none;}

#side {padding: 10vw 5vw;}
#Calender table { width: 100%;}
#Calender  {padding: 5vw;  margin: 0 auto;}
#SideBannar {margin:5vw; text-align: center;}
#SideBannar ul li img{width: auto;}

#footer {padding: 5vw; background: #9dc441;}
#footer_map {border: none;}
#footer ul {display: none;}
#footer_left .L img {width: auto;}
.L, .R {float: none; width: 100%;}
#footer p.R {margin-top: 6vw;} 
#footer_map iframe {width: 100%;}
#footer #copyright {font-size: 10px;}

/* home */
#home #col01 {display: flex; display: -webkit-flex; flex-wrap: wrap; flex-direction: column; width: 90%; margin: 5vw auto;}
#home #col01 .img_right {float: none; margin: 6vw auto 0; order: 3; width: 80vw;}
#home #col01 h3 {order: 1;}
#home #col01 p {order: 2;}
#home #col02 {background:#f3f3f3; padding: 5%;  height: auto;}
#home .col02box {float: none; width: 100%; margin: 4vw auto;}
#home .col02box h4 {text-align: center;}
#home .col02box h4 img {width: auto; }

#home #col03 {padding: 0; border: none;}
#home #col03 ul {display: flex; display: -webkit-flex; justify-content: space-between; flex-wrap: wrap; width: 90%; margin: 0 auto;}
#home #col03 ul li {width: 48%; float: none; margin: 1.5vw 0;}
#home #col03 ul li:last-child {width: 100%;}

#home #col04 {float: none; width: auto; margin: 0 auto; text-align: center;}
#home #col04 p img {width: auto;}

#home .point {width: 90%; margin: 10vw auto;}

#home #News {background: none;}
#home #News h3 {height: auto; width: 100%; background: #ABCF75;}
#home #News h3 img {width: auto; height: auto;}
#home #News dl {width: 90%; margin: 0 auto;}
#home #News dd {width: 100%; margin-bottom: 5vw;}

/* underlayer */
#page #Main {width: 90%; margin: 0 auto; padding-bottom: 10vw;}
#page #MainCont .point {width: 100%;}
#page #MainCont ul li {background: url(../../img/common/list_bg.gif) 0 7px no-repeat; padding-left: 18px;}
#page #MainCont .whitebox {margin: 4vw 0;}
#page #MainCont table {width: 100%;}

#page #MainCont h3 {font-size: 1.3rem;}
#page #MainCont h4 {font-size: 1.2rem; line-height: 1.4; margin: 3vw 0;}
#page #MainCont p.img_right {float: none; width: 100%; padding: 0; margin: 0 0 3vw;}

.LocalNav {margin-top: 0;}
.LocalNav h3 {height: auto;}

#page #MainCont div.hard_img ul {display: flex; display: -webkit-flex; justify-content: space-between; flex-wrap: wrap; margin: 0;}
#page #MainCont div.hard_img ul li {float: none; width: 48%;}
#page #MainCont div.hard_img ul li dl {width: 100%; margin: 3vw 0;}
#page #MainCont dl dt {padding: 0;}
#page #MainCont div.hard_img dl dd {padding: 0;}

#page #MainCont .menu {padding: 0;}

#page #MainCont div.half_box {float: none; width: 100%; }
#page #MainCont div.half_box h4 {margin-top: 5vw;}
#page #MainCont div.half_box  ul {margin-top: 0;}
#page #MainCont dl#profile {display: flex; display: -webkit-flex; justify-content: space-between; flex-wrap: wrap;}
#page #MainCont dl#profile dt  {float: none; width: 40%; padding: 0;}
#page #MainCont dl#profile dd {float: none;width: 60%; padding: 0;}

#page #MainCont dl dd {padding-left: 0;}


