/*====================
 - 1280px～：大型PC
 - 960px～1279px：小型PC
 - 600px～959px：タブレット
 - 480px～599px：SP横
 - ～479px：SP縦
====================*/

@charset "UTF-8";
body{ -webkit-text-size-adjust: 100%; }
.pcbr { display:block;}
.spbr{ display: none; }
.fr { color: #CC0000; }
#header { width: 100%; float: left; clear: both; margin: 0; padding: 0; }
.header-brand { width: 40%; float: left; margin: 0; padding: 0; }
.header-banner{ width: 60%; float: left; margin: 0; padding: 0; }
.discription{ width: 100%; float: left; clear: both; margin: 5px 0 0 0; padding: 0; font-size: 0.75rem; }
/* ul.pc-sub-menu{ width:80%;float:right;margin:0;padding:0;text-align:right;} */
ul.pc-sub-menu{ width:80%;float:right;margin:30px 0 0 0;padding:0;text-align:right;}
ul.pc-sub-menu li{ width:31%;float:left;margin:10px 0 0 2%;padding:0;text-align:right;}
ul.pc-sub-menu li:last-child{ margin-right:0;}
ul.pc-sub-menu li img{ width:100%;}
#gnav { width: 100%; float: left; clear: both; background: #202340; margin: 5px 0 0; }
ul#gnav-ul { width: 100%; float: left; clear: both; }
ul#gnav-ul li{ width: calc(100% / 8); float: left; text-align: center; font-size: 0.87rem; border-right: 1px solid #CCC; }
ul#gnav-ul li:first-child { border-left: 1px solid #CCC; }
ul#gnav-ul li a span { display: block; margin: 0px 0 0 0; color: #AAA; text-transform: uppercase; font-size: 80%; letter-spacing: 1px; }
ul#gnav-ul li a{ color: #FFF; font-weight: bold; display: block; text-decoration: none; padding: 12px 0; }
ul#gnav-ul li a:hover { background: #4D4F66; }
ul#gnav-ul li.active a { background: #2D2E37; }

/* header
------------------------------------------- */
.headerNav { max-width: none; font-size: 13px; font-weight: bold; }
.headerNav li { margin-left: 30px; }
.headerNav li:first-child { margin-left: 0; }
.headerNav li a { display: block; line-height: 48px; }
#js-menuBk { display: none; position: fixed; z-index: 1; top: 0; left: 0; background: rgba(0,0,0,0.6); }
.menuClose { display: inline-block; padding: 20px; }
.menuClose img { width: 17px; }
#js-closeBtnWrap { display: none; }
#js-openBtn { display: none; }


/* content
------------------------------------------- */
#content,#content02 { margin: 0; padding: 0; float: left; clear: both; width: 100%; }
#main { margin: 0; padding: 0; float: left; clear: both; width: 100%; }
.gree { margin: 40px 0 0 0; padding: 0; float: left; clear: both; width: 100%; }
.gree h2 { margin: 0; padding: 0; float: left; clear: both; width: 100%; font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif; font-size: 2rem; }
.linetitle { display: flex; align-items: center; }
.linetitle:before, .linetitle:after { border-top: 1px solid; content: ""; flex-grow: 1; }
.linetitle:before { margin-right: 1rem; }
.linetitle:after { margin-left: 1rem; }
.gree p{margin:20px 0;padding:0;float:left;clear:both;width:100%;font-size:0.875rem;text-align: center;line-height:1.5rem;}
p.head_txt {margin:0 4%;width:92%;line-height:2;text-align:center;font-weight:normal;float:left;clear:both;font-size:0.875rem;}
.f_plan{margin:0 0 20px 0;padding:0;float:left;clear:both;width:100%;}
.planMenu{margin:0 0 0px 0;padding:0;width:calc(100% / 4);float:left;}
.planMenu .wrap96{margin:20px 2%;padding:1%;width:96%;display:inline-block;border:1px solid #333;}
.planMenu02,.planMenu03{margin: 0;padding:0;width:100%;}
.planMenu02 .wrap96-nl{margin:20px 0 20px 0;padding:0 1%;width:calc(100% / 3);display:inline-block;}
.planMenu03{margin:0;padding:0;width:calc(100% / 2);float:left;}
.planMenu03 .wrap96{margin:20px 1%;padding:1%;width:98%;display:inline-block;border:1px solid #333;}
.wrap96-nl { margin: 20px 2% 10px; padding: 0; width: 96%; float: left; } 
.planMenu .entry-photo { width: 100%; height: 250px; object-fit: cover; overflow: hidden; }
.planMenu02 .entry-photo { width: 100%; height: 220px; object-fit: cover; overflow: hidden; }
.planMenu03 .entry-photo02 { width: 36%; float: left; margin: 2%; }
.planMenu03 .entry-photo02 img{ width: 100%; height: 220px; object-fit: cover; overflow: hidden; }
.planMenu03 .entry-block { width: 56%; float: left; margin: 2%; }
h3.entry-title{ margin: 10px 2% 5px; padding: 0; width: 96%; float: left; clear: both; text-align: center; font-weight: bold; font-size: 1.25rem; }
h3.entry-title02{ margin: 10px 0 5px; padding: 0 0 5px 0; width: 100%; float: left; clear: both; text-align: center; font-weight: bold; font-size: 1.25rem; position: relative; border-bottom: 2px solid #CCC; }
.planMenu03 h3.entry-title{ margin: 10px 0 5px; padding: 0 0 5px 0; width: 100%; float: left; clear: both; text-align: center; font-weight: bold; font-size: 1.25rem; position: relative; border-bottom: 2px solid #CCC; }
h3.entry-title02::after { position: absolute; bottom: -2px; left: 0; z-index: 2; content: ''; width: 20%; height: 2px; background: #B81B24; }
.planMenu03 h3.entry-title::after { position: absolute; bottom: -2px; left: 0; z-index: 2; content: ''; width: 20%; height: 2px; background: #02004B; }
h3.entry-title a,h3.entry-title02 a{ text-decoration: none; }
.planMenu .article_txt{ margin: 2px 0 0 3%; padding: 0; width: 96%; float: left; clear: both; font-size: 0.875rem; }
.article_txt{ margin: 2px 0 0 2%; padding: 0; width: 96%; float: left; clear: both; font-size: 0.875rem; }
.moreBtn{ margin: 5px 15% 20px; padding: 5px 0; width: 70%; float: left; clear: both; color: #FFF; background: #02004B; text-align: center; border-radius: 10px; }
.moreBtn a{ color: #FFF; font-size: 0.875rem; text-decoration: none; display: block; }

#main-content { float: left; width: 74%; margin: 20px 0 0 0; padding: 0; }
#main-content02 { float: left; width: 74%; margin:20px 0 0 0; padding:20px 0 0 0; position: relative; border-top: 2px solid #CCC;text-align:left; }
#main-content03 { float: left; width: 100%; margin:40px 0 0 0; padding:20px 0 0 0; position: relative; border-top: 2px solid #CCC;text-align:left; clear: both; }
#main-content02::after,#main-content03::after { position:absolute;top: -2px;left:0;z-index:2; content: '';width:15%;height:2px;background:#B81B24; }
h2.contentstitle{ position: relative; padding: 12px 1em 8px 40px; border:1px solid #ccc; background:-webkit-linear-gradient(top, #fff 0%, #f0f0f0 100%);background: linear-gradient(to bottom, #fff 0%, #f0f0f0 100%);box-shadow:0 -1px 0 rgba(255, 255, 255, 1) inset; border-radius:7px;font-weight:bold; font-size: 1.2rem; line-height: 22px; float:left; clear:both;width: 100%; color: #CC0000; }
h4{ position: absolute; top:10px; left: 2%; padding: 12px 1em 8px 40px; border:1px solid #ccc; background:-webkit-linear-gradient(top, #fff 0%, #f0f0f0 100%);background: linear-gradient(to bottom, #fff 0%, #f0f0f0 100%);box-shadow:0 -1px 0 rgba(255, 255, 255, 1) inset; border-radius:7px;font-weight:bold; font-size: 1.2rem; line-height: 22px; float:left; clear:both;width: 96%; color: #CC0000; }
h2.contentstitle::after,h4::after{position:absolute;top:10px;left:.6em;z-index:2;content:'';width:20px;height:20px;border:5px solid #B81B24;border-radius:100%;}
#main-content .kiji{ float: left; clear: both; width: 96%; margin: 20px 0% 0; padding: 0; font-size: 0.875rem; line-height: 1.5rem; position: absolute; top:40px; left: 2%; }
.bgimg{ width: 100%; position: relative; height: 280px; }
.bgimg img{ width: 100%; overflow: visible; }
ul.btnArea { margin: 0; padding: 0; float: left; clear: both; width: 100%; }
ul.btnArea li{ margin: 0; padding: 0 0 15px 0; float: left; width: 100%; display: block; }
.pankuzu {float:left;clear:both;width:100%;margin:20px 0 0;font-size:0.75rem;}
.pagehead{ margin: 10px 0 5px; padding: 0 0 5px 0; width: 100%; float: left; clear: both; text-align: center; font-weight: bold; font-size: 1.25rem; position: relative; border-top: 2px solid #CCC; }
.pagehead::after { position: absolute; bottom: -2px; left: 0; z-index: 2; content: ''; width: 20%; height: 2px; background: #B81B24; }

.head_c_title { margin:0;position:relative;font-weight:normal;margin-bottom:35px;font-size:40px;text-align:center;}
.head_c_title-point {display:block;font-size:14px;margin-top:10px;position:relative;width:140px;margin:10px auto 0;background:#fff; }
.head_c_title-point:before { content: '';height:1px;background:#ccc;position:absolute;top:0;bottom:0;margin:auto;z-index:-1;width:460px;left:-160px;}


.contact-box { margin: 20px 2% 50px; float: left; clear: both; width: 96%; }
.contact-box .left-box{ margin: 0; float: left; width: 68%; }
.contact-box .right-box{ margin: 0; float: right; width: 30%; }
.contact-box .right-box ul{ margin: 0; float: left; clear: both; width: 100%; }
.contact-box .right-box ul li{ margin: 0 0 10px 0; float: left; clear: both; width: 100%; }

.banner { margin: 20px 0 0 0; padding: 0; width: 100%; float: left; clear: both; }
.bannerarea { margin: 0 0 20px 0; padding: 0; width: 100%; float: left; clear: both; }
.bannerarea img{ width: 100%; }

/* サイドメニュー
------------------------------------------- */
#side-menu { float: right; width: 23%; margin: 20px 0 0 0; padding: 0; }
.subMenu { float: left; clear: both; width: 100%; margin: 0; padding: 0; }
.subMenu h5{ width: 100%; background: url(../img/sNav_bg.jpg) repeat-x; color: #FFF; margin: 0; padding: 0 0 0 4%; height: 45px; line-height: 45px; font-weight: bold; float: left; clear: both; }
.subMenu h6{ width: 90%; background: #B81B24; color: #FFF; margin: 15px 5% 0; padding: 8px 0; float: left; clear: both; border-radius: 40px; text-align: center; font-weight: bold; }
ul.sNavList { width: 100%; float: left; clear: both; background: #F9F9FA; margin: 0 0 30px 0; }
ul.sNavList li{ width: 100%; padding: 0 0 0 5%; float: left; clear: both; height: 50px; line-height: 50px; border-bottom: 1px solid #999; }
ul.sNavList li a{ display: block; text-decoration: none; background: url(../img/arrow_right.png) no-repeat right top; }
.img90 { float: left; clear: both; width: 90%; margin: 0 5% 5px; padding: 0; }
.img90 img{ width: 100%; }
.imgbtn {float:left;clear:both;width:100%;margin:15px 0 30px 0;padding:0;text-align:center;}

/* footer
------------------------------------------- */
#footer { float: left; clear: both; width: 100%; margin: 100px 0 0 0; }
.footer01 { background: #000; color: #FFF; float: left; clear: both; width: 100%; padding: 50px 0 80px; }
.footer01 a { color: #EEE; text-decoration: none; }
.fimg { position: absolute; left: 0%; top: -145px; }
.f_Box { width:46%; margin: 0 2%; float: left; display: block; }
.f_Box02 { width:21%; margin: 0 2%; float: left; display: block; }
.f_Box ul,.f_Box02 ul{ width:100%; margin: 20px 0 0 0; float: left; clear: both; }
.f_Box ul li{ width: 48%; margin: 0 1% 10px; float: left; }
.f_Box02 ul li{ width: 98%; margin: 0 1% 10px; float: left; }
.f_Box ul li::before,.f_Box02 ul li::before{ content:">"; color: #CC0000; padding: 0 5px 0 0; }
.footertitle { position: relative; padding: 12px 1em 8px 40px; border-bottom: 2px solid #ccc; font-weight: bold;  font-size: 1.25rem; }
.footertitle::after { position: absolute; top: 10px; left: .6em; z-index: 2; content: ''; width: 20px; height: 20px; border: 5px solid #B81B24; border-radius: 100% }
.footer02 { float: left; clear: both; width: 100%; padding: 30px 0; font-size: 0.85rem; line-height: 1.2rem; border-top: 5px solid #CC0000; position: relative; }
.cAdd{ float: left; clear: both; width: 100%; }
.flogo{ float: left; width: 30%; }
.caddtxt { float: left; width: 50%; }
.f_sns { float: left; width: 20%; text-align: right; }
ul.snsicon { width: 100%; float: left; clear: both; }
ul.snsicon li { width: 18%; margin: 0 1% 20px; float: left; font-size: 2rem; }
.copyright { width: 100%; padding: 5px 0; float: left; clear: both; text-align: center; background: #CC0000; font-size: 0.75rem; color: #FFF; }



/* ------------------------------ */
/* 1280px～：大型PC
/* ------------------------------ */
@media screen and (min-width:1280px) {
a[href^="tel:"] { pointer-events: none; }

.sp_header-banner,.sp_sub-menu,.sp,#nav-drawer,.br_sp { display: none; }
.wrap { width: 1280px; margin: 0 auto; position: relative; }
.footerwarp { width:1280px; margin: 0 auto; background: #cc0000; }

.header-brand { width: 40%; float: left; margin: 0px 0 0 0; padding: 0; }
.header-banner { width: 60%; float: right; margin: 10px 0 0 0; text-align: right; }
.header-banner ul.sub-menu{ margin-left: auto; clear: both; text-align: right; margin: 5px 0 0 0; }
.header-banner ul.sub-menu li{ display:inline; padding:0 5px; }

ul.bannerArea { float: left; width: 100%; margin: 0; padding: 0; clear: both; }
ul.bannerArea li{ float: left; width: 90%; margin: 0 5% 30px; padding: 0; clear: both; }

#footer { float: left; clear: both; width: 100%; margin: 100px 0 0 0; position: relative; }
.footer01 { background: #000; color: #FFF; float: left; clear: both; width: 100%; padding: 20px 0 40px; }
.footer02 { position: relative; width: 100%; }
#gotop { position: absolute; right: 0%; bottom: 30px; }
#gotop img{ width: 80%; margin: 0 0 0 20%; }

.contact-box { margin: 20px 2% 0; float: left; clear: both; width: 96%; }
.contact-box .left-box{ margin: 0; float: left; width: 68%; }
.contact-box .right-box{ margin: 0; float: right; width: 30%; }
.contact-box .right-box ul{ margin: 0; float: left; clear: both; width: 100%; }
.contact-box .right-box ul li{ margin: 0 0 5px 0; float: left; clear: both; width: 100%; }


}



/* ------------------------------ */
/* 960px～1279px：小型PC
/* ------------------------------ */
@media screen and (min-width:960px) and (max-width:1279px) {
a[href^="tel:"] { pointer-events: none; }

.sp_header-banner,.sp_sub-menu,.sp,#nav-drawer,.br_sp,.spbr { display: none; }
.wrap { width: 96%; margin: 0 auto; }
.header-brand { width: 30%; float: left; margin: 0px 0 0 0; padding: 0; }
.header-banner { width: 70%; float: right; margin: 10px 0 0 0; text-align: right; }
.header-banner ul.sub-menu { margin-left: auto; clear: both; text-align: right; margin: 5px 0 0 0; width: 100%; }
.header-banner ul.sub-menu li{ display:inline; padding:0 0.5%; width: 31%; }
.header-banner ul.sub-menu li img{ width: 25%; }

ul#gnav-ul li{ font-size: 0.75rem; border-right: 1px solid #CCC; }
h3.entry-title02{ margin: 10px 0 5px; padding: 0 0 5px 0; width: 100%; float: left; clear: both; text-align: center; font-weight: bold; font-size: 1rem; position: relative; border-bottom: 2px solid #CCC; }
.article_txt{ margin: 2px 0 0 0; padding: 0; width: 100%; float: left; clear: both; font-size: 0.875rem; }
.planMenu03 h3.entry-title{ margin: 10px 0 5px; padding: 0 0 5px 0; width: 100%; float: left; clear: both; text-align: center; font-weight: bold; font-size: 1rem; position: relative; border-bottom: 2px solid #CCC; }
.planMenu02 {margin: 0;padding:0;width:100%;}
.planMenu02 .wrap96-nl{margin:20px 0 0 0;padding:0 1%;width:calc(100% / 3);display:inline-block;}
.planMenu02 .wrap96-nl .article_txt{height:80px;}

.footertitle { position: relative; padding: 12px 1em 8px 40px; border-bottom: 2px solid #ccc; font-weight: bold;  font-size: 1rem; }
.f_Box ul,.f_Box02 ul{ font-size: 0.85rem; }
.caddtxt { float: left; width: 45%; }
.f_sns { float: left; width: 25%; text-align: right; }
.footer02 { position: relative; width: 100%; }
#gotop { position: absolute; right: 0%; bottom: 30px; }
#gotop img{ width: 80%; margin: 0 0 0 20%; }

ul.bannerArea { float: left; width: 100%; margin: 0; padding: 0; clear: both; }
ul.bannerArea li{ float: left; width: 90%; margin: 0 5% 30px; padding: 0; clear: both; }
#footer{float:left;clear:both;width:100%;margin:50px 0 0 0;position:relative;}
.footer01 { background: #000; color: #FFF; float: left; clear: both; width: 100%; padding: 20px 0 40px; }
.footer02 { position: relative; width: 100%; }
#gotop { position: absolute; right: 0%; bottom: 30px; }
#gotop img{ width: 40%; margin: 0 0 0 60%; }

.contact-box { margin: 20px 2% 50px; float: left; clear: both; width: 96%; }
.contact-box .left-box{ margin: 0; float: left; width: 68%; }
.contact-box .right-box{ margin: 0; float: right; width: 30%; }
.contact-box .right-box ul{ margin: 0; float: left; clear: both; width: 100%; }
.contact-box .right-box ul li{ margin: 0 0 5px 0; float: left; clear: both; width: 100%; }

}




/* ------------------------------ */
/* 600px～959px：タブレット
/* ------------------------------ */
@media screen and (min-width:600px) and (max-width:959px) {
a[href^="tel:"] { pointer-events: none; }

.pc { display: none; }
.sp,.spbr{ display: block; }
.wrap { width: 100%; margin: 0 auto; }

#header { position: relative; margin: 0; padding: 0; }
.headerNavWrap { display: block; position: relative; padding: 0px 17px 6px; }
.headerNav { display: block; }
.header-brand { width: 100%; float: left; clear: both; margin: 0; padding: 0; }
.discription{ width: 100%; float: left; clear: both; margin: 0; padding: 3px 0; text-align: center; background: #B81B25; color: #FFF; font-weight: bold; font-size: 0.75rem; }
#header h1#logo,#header div#logo, { text-align: left; margin: 0 0 0 1%; width: 40%; }

#js-closeBtnWrap { display: block; background: #fff; }
#js-openBtn { display: block; position: absolute; top: 20px; right: 10px; }
#js-openBtn img { width: 40px; }
#js-spNav { position: absolute; z-index: 2; top: 0; right: 0; width: 50%; background: #f1f1f1; transform: translateX(100%); transition: all .3s; }
#js-spNav.isOpen { transform: translateX(0); }
ul.headerNav { margin: 10px 0 0 0; padding: 0; width: 100%; float: left; clear: both; }
.headerNav li { margin-left: 0; background: #f7f7f7; border-bottom: 1px solid #dbdbdb; }
.headerNav li:first-child { border-top: 1px solid #dbdbdb; }
.headerNav li a { position: relative; padding: 0 15px; font-weight: normal; line-height: 50px; text-decoration: none; }
.headerNav li a::after { position: absolute; top: 0; right: 17px; bottom: 0; width: 7px; height: 7px; margin: auto; border-right: 1px solid #B81B24; border-bottom: 1px solid #B81B24; transform: rotate(-45deg); content: ""; }
.headerNav li a:hover { color: #B81B24; }

.sp_header-banner { margin: 0; padding: 10px 0 0 0; width: 100%; float: left; clear: both; }
.sp_header-banner ul.lang li{ margin: 0 2%; padding: 10px 0 0 0; width: 19%; float: left; }
.sp_header-banner ul.lang li.tel{ margin: 0 2%; padding: 0; width: 46%; float: left; }
.sp_header-banner ul.sp_sub-menu { margin: 0; padding: 20px 0 0 0; width: 100%; float: left; clear: both; }
.sp_header-banner ul.sp_sub-menu li{ margin: 0 2%; padding: 0; width: 46%; float: left; }

/* content
------------------------------------------- */
.gree h2 { margin: 0; padding: 0; float: left; clear: both; width: 100%; font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif; font-size: 1.75rem; text-align: center; line-height: 2.2rem; }
.br_sp { float: left; clear: both; display: block; }
.gree p { margin: 20px 0%; padding: 0; float: left; clear: both; width: 100%; font-size: 0.875rem; text-align: center; }
.f_plan { margin: 0 2%; padding: 0; float: left; clear: both; width: 96%; }
.planMenu { margin: 0px 1% 20px; padding: 0; width: 48%; float: left; }
.planMenu02 {margin: 0;padding:0;width:100%;float:left;clear:both;}
.planMenu02 .wrap96-nl{margin:20px 0 0 0;padding:0 1%;width:calc(100% / 2);display:inline-block;}
.planMenu02 .wrap96-nl .article_txt{height:80px;}
.planMenu03 h3.entry-title{font-size:1.125rem;}
h3.entry-title02{ margin: 10px 0 5px; padding: 0 0 5px 0; width: 100%; float: left; clear: both; text-align: center; font-weight: bold; font-size: 0.85rem; position: relative; border-bottom: 2px solid #CCC; }

#main-content,#main-content02 { float: left; width: 94%; margin: 20px 3% 0; padding: 0; clear: both; }
#side-menu { float: left; width: 100%; margin: 20px 0 0; padding: 0; clear: both; }
ul.bannerArea{ float: left; width: 100%; margin: 0; padding: 0; clear: both; }
ul.bannerArea li{ display:inline-block; width: 45%; margin: 0; padding: 0; }
ul.bannerArea li:first-child{ display:inline-block; width: 45%; margin: 0 1% 40px 3%; padding: 0; }
ul.bannerArea li:last-child{ display:inline-block; width: 45%; margin: 0 3% 40px 1%; padding: 0; }
ul.bannerArea li img{ width: 100%; }
.pankuzu {float:left;clear:both;width:96%;margin:20px 2% 0;font-size:0.75rem;}

.contact-box { margin: 20px 0% 50px; float: left; clear: both; width: 100%; }
.contact-box .left-box{ margin: 0; float: left; width: 60%; }
.contact-box .right-box{ margin: 0; float: right; width: 35%; }
.contact-box .right-box ul{ margin: 0; float: left; clear: both; width: 100%; }
.contact-box .right-box ul li{ margin: 0 0 5px 0; float: left; clear: both; width: 100%; }

/* footer
------------------------------------------- */
#footer { float: left; clear: both; width: 100%; margin: 0; position: relative; }
.footer01 { background: #000; color: #FFF; float: left; clear: both; width: 100%; padding: 20px 0 40px; }
.footer02 { position: relative; width: 100%; }
.f_Box { width:96%; margin: 0 2%; float: left; clear: both; display: block; }
.f_Box02 { width:46%; margin: 0 2%; float: left; }
.f_Box .footertitle { font-size: 1rem; }
.f_Box02 .footertitle { font-size: 1rem; margin: 40px 0 0 0; }
.f_Box ul li { width:46%; margin: 0 2% 5px; float: left; font-size: 0.75rem; }
.f_Box02 ul li { width:96%; margin: 0 0 5px 3%; float: left; clear: both; font-size: 0.75rem; }
.f_Box02 { width:46%; margin: 0 2%; float: left; }

.flogo{ float: left; clear: both; width: 100%; margin: 0; text-align: center; }
.flogo .f_logo{ float: left; clear: both; width: 50%; margin: 0 25%; }
.caddtxt { float: left; clear: both; width: 100%; margin: 0; text-align: center; }
.f_sns { float: left; width: 100%; text-align: center; clear: both; margin: 20px 0 0 0; }
ul.snsicon { width: 40%; margin: 0 30%; float: left; clear: both; }
ul.snsicon li { width: 18%; margin: 0 1% 20px; float: left; font-size: 2rem; }
#gotop { position: absolute; right: 0%; bottom: 30px; }
#gotop img{ width: 80%; margin: 0 0 0 20%; }


}


/* ------------------------------ */
/* 480px～599px：SP横
/* ------------------------------ */
@media screen and (min-width:480px) and (max-width:599px) { 
.pc, #gnav{ display: none; }
.sp,.spbr{ display: block; }
.wrap { width: 100%; margin: 0; }

#header { position: relative; margin: 0; padding: 0; position: fixed; background:#FFF; z-index: 11111; top: 0; }
.headerNavWrap { display: block; position: relative; padding: 0;  }
.headerNav { display: block; }
.header-brand { width: 100%; float: left; clear: both; margin: 0; padding: 0; }
.discription{ width: 100%; float: left; clear: both; margin: 0; padding: 3px 0; text-align: center; background: #B81B25; color: #FFF; font-weight: bold; font-size: 0.75rem; }
#header h1#logo,#header div#logo { text-align: left; margin: 13px 0 0 2%; width: 40%; }

#js-closeBtnWrap { display: block; background: #fff; }
#js-openBtn { display: block; position: absolute; top: 36px; right: 5px; }
#js-openBtn img { width: 30px; }
#js-spNav { position: fixed; z-index: 2; top: 0px; right: 0; width: 78%; background: #f1f1f1; transform: translateX(100%); transition: all .3s; }
#js-spNav.isOpen { transform: translateX(0); }
ul.headerNav { margin: 10px 0 0 0; padding: 0; width: 100%; float: left; clear: both; }
.headerNav li { margin-left: 0; background: #f7f7f7; border-bottom: 1px solid #dbdbdb; }
.headerNav li:first-child { border-top: 1px solid #dbdbdb; }
.headerNav li a { position: relative; padding: 0 15px; font-weight: normal; line-height: 50px; text-decoration: none; }
.headerNav li a::after { position: absolute; top: 0; right: 17px; bottom: 0; width: 7px; height: 7px; margin: auto; border-right: 1px solid #B81B24; border-bottom: 1px solid #B81B24; transform: rotate(-45deg); content: ""; }
.headerNav li a:hover { color: #B81B24; }

.sp_header-banner { margin: 0; padding: 10px 0 0 0; width: 100%; float: left; clear: both; }
.sp_header-banner ul.lang li{ margin: 0 2%; padding: 10px 0 0 0; width: 20%; float: left; }
.sp_header-banner ul.lang li.tel{ margin: 0 2%; padding: 0; width: 46%; float: left; }
.sp_header-banner ul.sp_sub-menu { margin: 0; padding: 20px 0 0 0; width: 100%; float: left; clear: both; }
.sp_header-banner ul.sp_sub-menu li{ margin: 0 2%; padding: 0; width: 46%; float: left; }

/* content
------------------------------------------- */
#content { margin: 0; padding: 0px 0 0 0; float: left; clear: both; width: 100%; }
#content02 { margin: 0; padding: 80px 0 0 0; float: left; clear: both; width: 100%; }
.flexslider {width:100%;height:auto; padding: 80px 0 0 0;}
.gree h2 { margin: 0; padding: 0; float: left; clear: both; width: 100%; font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif; font-size: 1.5rem; text-align: center; line-height: 2.2rem; }
.br_sp { float: left; clear: both; display: block; }
.gree p { margin: 20px 0%; padding: 0; float: left; clear: both; width: 100%; font-size: 0.875rem; text-align: left; }
p.head_txt {margin:0 4%;width:92%;line-height:2;text-align:left;font-weight:normal;float:left;clear:both;font-size:0.875rem;line-height:1.5rem;}
.planMenu { margin: 20px 0 0 0; padding: 0; width: calc(100% / 2); float: left; }
#main-content,#main-content02 {float:left;clear:both;width:96%;margin:40px 2% 0;padding:0;}
.box70,.box30 { margin: 0; padding: 0; width: 100%; float: left; clear: both; display: block; } 
.f_plan { margin: 0 2%; padding: 0; float: left; clear: both; width: 96%; }
.planMenu .entry-photo {width:100%;height:auto;float:left;clear:both;margin:0%;}
ul.btnArea { margin: 20px 0 0 0; padding: 0; float: left; clear: both; width: 100%; }
ul.btnArea li{ margin: 0 1%; padding: 0; float: left; width: 31%; display: block; }
ul.btnArea li img{ width: 100%; }
.planMenu02 {margin: 0;padding:0;width:100%;float:left;clear:both;}
.planMenu02 .wrap96-nl{margin:20px 0 0 0;padding:0 1%;width:calc(100% / 2);display:inline-block;}
.planMenu02 .wrap96-nl .entry-title02{font-size:1rem;}
.planMenu03 .entry-photo02 { width: 100%; float: left; clear: both; margin: 0%; }
.planMenu03 .entry-photo02 img{ width: 100%; height: 220px; object-fit: cover; overflow: hidden; }
.planMenu03 .entry-block { width: 96%; float: left; clear: both; margin: 2%; }
.planMenu03 h3.entry-title{font-size:1.125rem;}
#side-menu { float: left; width: 100%; margin: 20px 0 0; padding: 0; clear: both; }
.pankuzu {float:left;clear:both;width:96%;margin:20px 2% 0;font-size:0.75rem;}
h3.entry-title02{ margin: 10px 0 5px; padding: 0 0 5px 0; width: 100%; float: left; clear: both; text-align: center; font-weight: bold; font-size: 0.85rem; position: relative; border-bottom: 2px solid #CCC; }

ul.bannerArea{ float: left; width: 100%; margin: 0; padding: 0; clear: both; }
ul.bannerArea li{ display:inline-block; width: 45%; margin: 0; padding: 0; }
ul.bannerArea li:first-child{ display:inline-block; width: 45%; margin: 0 1% 40px 3%; padding: 0; }
ul.bannerArea li:last-child{ display:inline-block; width: 45%; margin: 0 3% 40px 1%; padding: 0; }

.contact-box { margin: 20px 0% 50px; float: left; clear: both; width: 100%; }
.contact-box .left-box{ margin: 0; float: left; width: 60%; }
.contact-box .right-box{ margin: 0; float: right; width: 35%; }
.contact-box .right-box ul{ margin: 0; float: left; clear: both; width: 100%; }
.contact-box .right-box ul li{ margin: 0 0 5px 0; float: left; clear: both; width: 100%; }

/* footer
------------------------------------------- */
#footer{float:left;clear:both;width:100%;margin:50px 0 0 0;position:relative;}
.footer01 { background: #000; color: #FFF; float: left; clear: both; width: 100%; padding: 20px 0 40px; }
.footer02 { position: relative; width: 100%; }
.f_Box { width:96%; margin: 0 2%; float: left; clear: both; display: block; }
.f_Box02 { width:46%; margin: 0 2%; float: left; }
.f_Box .footertitle { font-size: 0.875rem; }
.f_Box02 .footertitle { font-size: 0.875rem; margin: 20px 0 0 0; }
.f_Box ul li { width:50%; margin: 0 0% 5px; float: left; font-size: 0.75rem; }
.f_Box02 ul li { width:100%; margin: 0 0 5px 0; float: left; clear: both; font-size: 0.75rem; }
.f_Box02 { width:46%; margin: 0 2%; float: left; }

.flogo{ float: left; clear: both; width: 100%; margin: 0; text-align: center; }
.flogo .f_logo{ float: left; clear: both; width: 50%; margin: 0 25%; }
.caddtxt { float: left; clear: both; width: 100%; margin: 0; text-align: center; }
.f_sns { float: left; width: 100%; text-align: center; clear: both; margin: 20px 0 0 0; }
ul.snsicon { width: 50%; margin: 0 25%; float: left; clear: both; }
ul.snsicon li { width: 18%; margin: 0 1% 20px; float: left; font-size: 2rem; }
#gotop { position: absolute; right: 0%; bottom: 40px; }
#gotop img{ width: 60%; margin: 0 0 0 40%; }

}



/* ------------------------------ */
/* ～479px：SP縦
/* ------------------------------ */
@media screen and (max-width:479px) {
.pc, #gnav{ display: none; }
.pcbr{ display: none; }
.sp,.br_sp{ display: block; }
.spbr{ display: block; clear: both; }
.wrap { width: 100%; margin: 0 auto; }

#header { margin: 0; padding: 0; position: fixed; background:#FFF; z-index: 11111; top: 0; }
.headerNavWrap { display: block; position: relative; padding: 0;  }
.headerNav { display: block; }
.header-brand { width: 100%; float: left; clear: both; margin: 0; padding: 0; }
.discription{ width: 100%; float: left; clear: both; margin: 0; padding: 3px 0; text-align: center; background: #B81B25; color: #FFF; font-weight: bold; font-size: 0.75rem; }
#header h1#logo,#header div#logo { text-align: left; margin: 13px 0 0 2%; width: 40%; }

#js-closeBtnWrap { display: block; background: #fff; }
#js-openBtn { display: block; position: absolute; top: 36px; right: 5px; }
#js-openBtn img { width: 30px; }
#js-spNav { position: fixed; z-index: 2; top: 0px; right: 0; width: 78%; background: #f1f1f1; transform: translateX(100%); transition: all .3s; }
#js-spNav.isOpen { transform: translateX(0); }
ul.headerNav { margin: 10px 0 0 0; padding: 0; width: 100%; float: left; clear: both; }
.headerNav li { margin-left: 0; background: #f7f7f7; border-bottom: 1px solid #dbdbdb; }
.headerNav li:first-child { border-top: 1px solid #dbdbdb; }
.headerNav li a { position: relative; padding: 0 15px; font-weight: normal; line-height: 50px; text-decoration: none; }
.headerNav li a::after { position: absolute; top: 0; right: 17px; bottom: 0; width: 7px; height: 7px; margin: auto; border-right: 1px solid #B81B24; border-bottom: 1px solid #B81B24; transform: rotate(-45deg); content: ""; }
.headerNav li a:hover { color: #B81B24; }

.sp_header-banner { margin: 0; padding: 10px 0 0 0; width: 100%; float: left; clear: both; }
.sp_header-banner ul.lang li{ margin: 0 5%; padding: 10px 0 0 0; width: 40%; float: left; text-align: center; }
.sp_header-banner ul.lang li.tel{ margin: 0 10%; padding: 10px 0 0 0; width: 80%; float: left; }
.sp_header-banner ul.sp_sub-menu { margin: 0; padding: 20px 0 0 0; width: 100%; float: left; clear: both; }
.sp_header-banner ul.sp_sub-menu li{ margin: 10px 10% 0; padding: 0; width: 80%; float: left; }
.sp_header-banner ul.lang li img{ width: 80%; }
.sp_header-banner ul.lang li.tel img{ width: 100%; }
.sp_header-banner ul.sp_sub-menu li img{ width: 100%; }

/* content
------------------------------------------- */
#content { margin: 0; padding: 0px 0 0 0; float: left; clear: both; width: 100%; }
#content02 { margin: 0; padding: 80px 0 0 0; float: left; clear: both; width: 100%; }
.gree { margin: 20px 0 0 0; padding: 0; float: left; clear: both; width: 100%; }
.gree h2 { margin: 0; padding: 0; float: left; clear: both; width: 100%; font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif; font-size: 1.25rem; text-align: center; line-height: 2.2rem; }
.br_sp { float: left; clear: both; display: block; }
.gree p { margin: 20px 0%; padding: 0; float: left; clear: both; width: 100%; font-size: 0.875rem; line-height: 1.25rem; text-align: left; }
.planMenu { width: calc(100% / 2); display: inline-block; height: auto; margin: 0; padding: 0px;  }
.planMenu .entry-photo{ margin: 0; padding: 0; width: 100%; height: auto; }
.planMenu h3.entry-title{ margin: 8px 2%; padding: 0; width: 96%; float: left; clear: both; text-align: center; font-weight: bold; font-size: 1rem; }
.planMenu .article_txt{ margin: 2px 0 2% 2%; padding: 0; width: 96%; float: left; clear: both; font-size: 0.85rem; }
.moreBtn{ display: block; margin: 5px 5% 20px; padding: 5px 0; width: 90%; float: left; clear: both; color: #FFF; background: #02004B; text-align: center; border-radius: 10px; }
.planMenu02 {margin: 0;padding:0;width:100%;float:left;clear:both;}
.planMenu02 .wrap96-nl{margin:20px 0 0 0;padding:0 1%;width:100%;display:inline-block;}
.planMenu02 .wrap96-nl .entry-photo{margin:0 2%;padding:0;width:96%;}
.planMenu02 .wrap96-nl .entry-photo img{width:100%;}
#main-content { float: left; clear: both; width: 96%; margin: 40px 2% 0; padding: 0; }
#main-content02 { float: left; clear: both; width: 96%; margin: 20px 2% 0; padding: 0; }
.box70,.box30 { margin: 0; padding: 0; width: 100%; float: left; clear: both; display: block; } 
.box70 { position: relative; } 
ul.btnArea { margin: 20px 0 0 0; padding: 0; float: left; clear: both; width: 100%; }
ul.btnArea li{ margin: 0 1%; padding: 0; float: left; width: 31%; display: block; }
ul.btnArea li img{ width: 100%; }
h4 { position: relative; padding: 12px 1em 12px 40px; border: 1px solid #ccc; background: -webkit-linear-gradient(top, #fff 0%, #f0f0f0 100%); background: linear-gradient(to bottom, #fff 0%, #f0f0f0 100%); box-shadow: 0 -1px 0 rgba(255, 255, 255, 1) inset; border-radius: 7px; font-weight: bold; font-size: 1rem; }
.pankuzu {float:left;clear:both;width:96%;margin:100px 2% 0;font-size:0.75rem;}
.head_c_title { margin:0;position:relative;font-weight:normal;margin-bottom:35px;font-size:28px;line-height:38px;text-align:center;}
p.head_txt {margin:0 1% 20px;width:98%;line-height:2;text-align:left;font-weight:normal;float:left;clear:both;font-size:0.875rem;line-height:1.5rem;}
.head_c_title-point {display:block;font-size:14px;margin-top:10px;position:relative;width:140px;margin:10px auto 0;background:#fff; }
.head_c_title-point:before { content: '';height:1px;background:#ccc;position:absolute;top:0;bottom:0;margin:auto;z-index:-1;width:280px;left:-70px;}

.planMenu02,.planMenu03 { margin: 0; padding: 0; width: 100%; float: left; }
.planMenu03 .entry-photo02 { width: 100%; float: left; clear: both; margin: 0%; }
.planMenu03 .entry-photo02 img{ width: 100%; height: 220px; object-fit: cover; overflow: hidden; }
.planMenu03 .entry-block { width: 96%; float: left; clear: both; margin: 2%; }
#side-menu { float: left; width: 100%; margin: 20px 0 0; padding: 0; clear: both; }

ul.bannerArea{ float: left; width: 100%; margin: 0; padding: 0; clear: both; }
ul.bannerArea li{ display:inline-block; width: 45%; margin: 0; padding: 0; }
ul.bannerArea li:first-child{ display:inline-block; width: 45%; margin: 0 1% 40px 3%; padding: 0; }
ul.bannerArea li:last-child{ display:inline-block; width: 45%; margin: 0 3% 40px 1%; padding: 0; }

.contact-box { margin: 20px 5% 50px; float: left; clear: both; width: 90%; }
.contact-box .left-box{ margin: 0; float: left; width: 100%; }
.contact-box .right-box{ margin: 20px 0 0 0; float: right; width: 100%; }
.contact-box .right-box ul{ margin: 0; float: left; clear: both; width: 100%; }
.contact-box .right-box ul li{ margin: 0 0 20px 0; float: left; clear: both; width: 100%; }
h2.contentstitle{ position: relative; padding: 8px 1em 8px 40px; border:1px solid #ccc; background:-webkit-linear-gradient(top, #fff 0%, #f0f0f0 100%);background: linear-gradient(to bottom, #fff 0%, #f0f0f0 100%);box-shadow:0 -1px 0 rgba(255, 255, 255, 1) inset; border-radius:7px;font-weight:bold; font-size: 1rem; line-height: 22px; float:left; clear:both;width: 100%; letter-spacing: -0.3px;}
h4{ width: 96%; margin:0; padding:0; position: absolute; top: 10px; left: 2%; padding: 8px 1em 8px 40px; border:1px solid #ccc; background:-webkit-linear-gradient(top, #fff 0%, #f0f0f0 100%);background: linear-gradient(to bottom, #fff 0%, #f0f0f0 100%);box-shadow:0 -1px 0 rgba(255, 255, 255, 1) inset; border-radius:7px; }
.bgimg {
  width: 100%;
  position: relative;
  height: 280px;
  background: url('../img/25471385.jpg') ;
  background-size: cover;
  background-position: center;
  aspect-ratio: 16 / 9; /* アスペクト比を保持してレスポンシブ */
}
/* footer
------------------------------------------- */
#footer { float: left; clear: both; width: 100%; margin: 0; position: relative; }
.footer01 { background: #000; color: #FFF; float: left; clear: both; width: 100%; padding: 20px 0 40px; }
.footer02 { position: relative; width: 100%; }
.f_Box { width:96%; margin: 0 2%; float: left; clear: both; display: block; }
.f_Box02 { width:46%; margin: 0 2%; float: left; }
.f_Box .footertitle { font-size: 0.875rem; }
.f_Box02 .footertitle { font-size: 0.875rem; margin: 20px 0 0 0; }
.f_Box ul li { width:50%; margin: 0 0% 5px; float: left; font-size: 0.75rem; }
.f_Box02 ul li { width:100%; margin: 0 0 5px 0%; float: left; clear: both; font-size: 0.75rem; }
.f_Box02 { width:46%; margin: 0 2%; float: left; }

.flogo{ float: left; clear: both; width: 100%; margin: 0; text-align: center; }
.flogo .f_logo{ float: left; clear: both; width: 50%; margin: 0 25%; }
.caddtxt { float: left; clear: both; width: 100%; margin: 0; text-align: center; }
.f_sns { float: left; width: 100%; text-align: center; clear: both; margin: 20px 0 0 0; }
ul.snsicon { width: 50%; margin: 0 25%; float: left; clear: both; }
ul.snsicon li { width: 18%; margin: 0 1% 20px; float: left; font-size: 2rem; }
#gotop { position: absolute; right: 0%; bottom: 40px; }
#gotop img{ width: 60%; margin: 0 0 0 40%; }



}



 



/*スマホ・タブレット用のメニュー設定*/
@media screen and (max-width:960px){
.change_btn{ width: 90%; margin: 32px auto; }
nav{ display:none; position: absolute; top:0; width: 100%; height: 100vh; background:rgba(255,255,255,1); left: 0;z-index:111111;  }
/*開閉ボタン*/
#nav_toggle{ display: block; width: 40px; height: 40px; position: relative; z-index: 100000000; position:absolute; top: 15px; right: 5px; }
#nav_toggle span{ display: block; height: 3px; background: #000; position:absolute; width: 100%; -webkit-transition: 0.5s ease-in-out; -moz-transition: 0.5s ease-in-out; transition: 0.5s ease-in-out;	}
#nav_toggle span:nth-child(1){ top:35px;}
#nav_toggle span:nth-child(2){ top:45px;}
#nav_toggle span:nth-child(3){ top:55px;}
/*開閉ボタンopen時*/
.open #nav_toggle span{ background: #02004B; }
.open #nav_toggle span:nth-child(1) { top: 22px; -webkit-transform: rotate(135deg); -moz-transform: rotate(135deg); transform: rotate(135deg); }
.open #nav_toggle span:nth-child(2) { width: 0; left: 50%; }
.open #nav_toggle span:nth-child(3) { top: 22px; -webkit-transform: rotate(-135deg); -moz-transform: rotate(-135deg); transform: rotate(-135deg); }
}

@media screen and (min-width:600px) and (max-width:959px) {
/*メニュー部分*/
nav{ display:none; position: absolute; top:0; width: 100%; height: 100vh; background:rgba(255,255,255,1); left: 0;z-index:111111;  }
ul.lang { width:40%;float:left;margin:0;padding:0;}
ul.lang li.eng{ width:30%;float:left;clear:both;margin:20px 0 0 5%;padding:0;}
ul.lang li.tel{ width:70%;float:left;clear:both;margin:20px 15%;padding:0;}
ul.lang li img{ width:100%;}
ul.sp_sub-menu { width:60%;float:left;margin:70px 0 0 0;padding:0;}
ul.sp_sub-menu li{ width:46%;float:left;margin:0 2%;}
ul.headerNav { width:100%;float:left;clear:both;margin:10px 0 0 0;padding:0;}
ul.headerNav li{ width:100%;}
}

@media screen and (max-width:599px){
/*メニュー部分*/
nav{ display:none; position: absolute; top:0; width: 100%; height: 100vh; background:rgba(255,255,255,1); left: 0;z-index:111111; }
ul.lang { width:100%;float:left;clear:both;margin:0;padding:0;}
ul.lang li.eng{ width:20%;float:left;clear:both;margin:10px 0 0 5%;padding:0;}
ul.lang li.tel{ width:70%;float:left;clear:both;margin:10px 15%;padding:0;}
ul.lang li img{ width:100%;}
ul.sp_sub-menu { width:100%;float:left;clear:both;margin:0;padding:70px 0 0 0;}
ul.sp_sub-menu li{ width:46%;float:left;margin:0 2%;}
ul.headerNav { width:100%;float:left;clear:both;margin:10px 0 0 0;padding:0;}
ul.headerNav li{ width:100%;}
}

@media screen and (max-width:479px) {
#nav_toggle{ display: block; width: 30px; height: 36px; position: relative; z-index: 100000000; position:absolute; top: 0px; right: 5px; }

}