@charset "utf-8";

/* common
-----------------------------------------------------------*/
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, font, ins, kbd, q, s, samp, small, strike, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table.table, caption, tbody, tfoot, thead {
border: 0;font-family: inherit;font-size: 100%;font-style: inherit;font-weight: inherit;margin: 0;outline: 0;padding: 0;vertical-align: baseline;}
:focus {outline: 0;}
ol, ul {list-style: none;}
table.table {border-collapse: separate;border-spacing: 0;}
caption {font-weight: normal;text-align: left;}
blockquote:before, blockquote:after,q:before, q:after {content: "";}
blockquote, q {quotes: "" "";}
a img{border: 0;}
figure{margin:0}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
display: block;
}

html {
-ms-text-size-adjust: 100%;
-webkit-text-size-adjust: 100%;
}

body {
position: relative;
color:#000;
font-family: 'Noto Sans JP', "メイリオ", sans-serif;
font-size: 100%;
font-size: 16px;
font-weight: 300;
letter-spacing: 1px;
}
.clearfix:after {
content: ".";
display: block;
clear: both;
height: 0;
visibility: hidden;
}
.clearfix {
display: inline-block;
overflow:hidden;
}
img {
vertical-align: bottom;
}
.strong,
strong {
	font-weight: bold !important
}

/* リンク設定
------------------------------------------------------------*/
a{color:#000;text-decoration:none;}
a:hover{color:#333;text-decoration: underline;}
a:active, a:focus {outline:0;}

.content p a,
#contents p a {font-weight: bold !important}

/* 全体
------------------------------------------------------------*/
.inner {
width:100%;
margin:0 auto;
clear: both;
}
@media only screen and (min-width: 767px){
.inner {
width: 1220px;
}
}
@media only screen and (max-width: 767px){
.inner {
width: 94%;
}
}


/* contents
*************/
#contents {
position: relative;
width: 100%;
height: auto;
clear: both;
}
#contents .contents {
width: 100%;
margin: 0 auto 0 auto;
}
#contents .inner {
width: 100%;
margin: 0 auto;
}
@media only screen and (min-width: 1200px){
#contents {
padding: 122px 0 0 0;
}
#contents .contents {
width: 1050px;
}
#contents .inner {
width: 1050px;
}
}
@media only screen and (max-width:1200px){
#contents {
padding: 122px 0 0 0;
}
#contents .contents {
width: 100%;
}
#contents .inner {
width: 94%;
}
}
@media only screen and (max-width: 767px){
#contents {
padding: 88px 0 0 0;
}
}



/* 画像自動縮小
*************/
#header img,
#footer img,
#contents img,
#top img,
#top1 img,
#top2 img,
#top3 img,
#top4 img,
#topbn img,
.page-visual-ttl img,
#title img,
#bn_contact img,
#contact2 img,
.content8 img,
.block1 img,
.logo img,
.box_line img,
.images img,
.stepr img,
.stepl img,
.boxbeaf img,
.ribbon11-wrapper img,
.block img,
.wrap1 img,
.wrap2 img,
.wrap3 img,
.wrap4 img,
.wrap5 img,
.wrap6 img,
.wrap7 img,
.wrap8 img,
.wrap9 img,
.col1 img,
.col2 img,
.col3 img,
.col4 img,
.col5 img,
.col6 img,
.listcol2 img,
.listcol3 img,
.listcol4 img {
max-width:100%;
height:auto;
}

/* フォント
*************/
/* fontsize */
.fontsize9 {
font-size: 9px;
line-height: 1.5em;
}
.fontsize11 {
font-size: 11px;
line-height: 1.5em;
}
.fontsize12 {
font-size: 12px;
line-height: 1.5em;
}
.fontsize13 {
font-size: 13px;
line-height: 1.5em;
}
.fontsize14 {
font-size: 14px;
}
.fontsize15 {
font-size: 15px;
line-height: 1.5em;
}
.fontsize16 {
font-size: 16px;
line-height: 1.5em;
}
.fontsize17 {
font-size: 17px;
line-height: 1.5em;
}
.fontsize18 {
font-size: 18px;
line-height: 1.5em;
}
.fontsize20 {
font-size: 20px;
line-height: 1.5em;
}
.fontsize22 {
font-size: 22px;
line-height: 1.5em;
}
.fontsize24 {
font-size: 24px;
line-height: 1.5em;
}
.fontsize26 {
font-size: 26px;
line-height: 1.5em;
}
.fontsize28 {
font-size: 28px;
line-height: 1.5em;
}
.fontsize30 {
font-size: 30px;
line-height: 1.5em;
}
.fontsize40 {
font-size: 40px;
line-height: 1.5em;
}
.lightheight1 {
line-height: 1.5em;
}
.lightheight2 {
line-height: 2em;
}
.lightheight3 {
line-height: 1.2em;
}



/* fontcolor */
.fontred {
color: #e40003;
}
.fontpink {
color: #e67c73;
}
.fontskyblue{
color: #039be5;
}
.fontblue {
color: #0e3c77;
}
.fontorange {
color: #ff5a00;
}
.fontgreen {
color: #51cc91;
}

.strong {
font-weight: 400;
}

.lineb {
padding: 0 0 10px 0;
margin: 0 0 10px 0;
font-size: 20px;
font-weight: 400;
border-bottom: 1px solid #666;
}


/* fontfamily */
.family1 {
font-family: 'YuMinB';
}
.family2 {
font-family: 'Dinpro';
}
.family3 {
font-family: 'Futura';
}
.family4 {
font-family: 'BookAntiqua';
}


@import url(‘https://fonts.googleapis.com/css?family=Noto+Sans+JP’);
.noto100 {font-weight:100;}
.noto300 {font-weight:300;}
.noto350 {font-weight:350;}
.noto400 {font-weight:400;}
.noto500 {font-weight:500;}
.noto700 {font-weight:700;}
.noto900 {font-weight:900;}


/* レイアウト
*************/
.left {
text-align: left;
}
.left2 {
float: left;
}
.right {
text-align: right;
}
.right2 {
float: right;
}
.center {
text-align: center;
}
.alignleft{
float:left;
clear:left;
margin:0px 20px 0 0px;
}
.aligncenter{
display: block;
margin-left: auto;
margin-right: auto;
padding: 0px 0px 10px 0px;
}
.alignright{
float:right;
clear:right;
margin:0px 0 0 20px;
}



/* margin */
.mt10 {margin-top : 10px !important;}
.mt20 {margin-top : 20px !important;}
.mt30 {margin-top : 30px !important;}
.mt40 {margin-top : 40px !important;}
.mt50 {margin-top : 50px !important;}
.mt60 {margin-top : 60px !important;}
.mt70 {margin-top : 70px !important;}
.mt80 {margin-top : 80px !important;}
.mb5 {margin-bottom : 5px !important;}
.mb10 {margin-bottom : 10px !important;}
.mb20 {margin-bottom : 20px !important;}
.mb30 {margin-bottom : 30px !important;}
.mb40 {margin-bottom : 40px !important;}
.mb50 {margin-bottom : 50px !important;}
.mb60 {margin-bottom : 60px !important;}
.mb70 {margin-bottom : 70px !important;}
.mb80 {margin-bottom : 80px !important;}
.mb90 {margin-bottom : 90px !important;}
.mb100 {margin-bottom : 100px !important;}
.mb8 {margin-bottom : 8% !important;}
.mr10 {margin-right: 10px !important;}
.mt-80 {margin-top: -80px!important;}


/* section
*************/
* html section.content article{height:1%;}

section.content {
width: 100%;
padding: 0 0 0 0;
margin: 0 0 100px 0;
line-height: 1.8em;
overflow: hidden;
text-align: left;
clear: both;
}
section.content2 {
width: 103%;
padding: 0 0 0 0;
margin: 0 0 100px 0;
overflow: hidden;
clear: both;
}
section.content3 {
width: 100%;
padding: 0 0 0 0;
margin: 0 0 0 0;
line-height: 1.8em;
text-align: left;
clear: both;
}
section.content4 {
width: 103%;
padding: 0 0 0 0;
margin: 0 0 50px 0;
overflow: hidden;
clear: both;
}
section.content5 {
width: 100%;
padding: 0 0 0 0;
margin: -50px 0 100px 0;
line-height: 1.8em;
overflow: hidden;
clear: both;
}
section.content6 {
width: 103%;
padding: 0 0 0 0;
margin: 0 0 0px 0;
overflow: hidden;
clear: both;
}
section.content7 {
width: 100%;
padding: 0 0 0 0;
margin: 0 0 50px 0;
line-height: 1.8em;
text-align: left;
clear: both;
}
section.content8 {
width: 100%;
padding: 0 0 0 0;
margin: 0 0 100px 0;
clear: both;
}


@media only screen and (min-width: 767px){
section.content {
width: 1050px;
margin: 0 0 100px 0;
}
section.content2 {
width: 1090px;
margin: 0 0 100px 0;
}
section.content3 {
width: 1050px;
}
section.content4 {
width: 1090px;
}
section.content5 {
width: 1050px;
}
section.content6 {
width: 1090px;
}
section.content7 {
width: 1050px;
margin: 0 0 50px 0;
}
section.content8 {
width: 1050px;
margin: 0 0 100px 0;
}

}
@media only screen and (max-width: 767px){
section.content,
section.content2,
section.content3,
section.content4,
section.content5,
section.content6,
section.content7 {
width: 100%;
}
section.content img{
max-width:100%;
height:auto;
}
}

* html section.content{height:1%;}
div.section.content p{margin-bottom:5px;}


/* headertop
*************/
h1 {
display: none;
}

/* header
*************/
@media only screen and (min-width: 767px) {
	#header {
		position: fixed;
		width: 100%;
		padding: 30px 0 30px 40px;
		letter-spacing: 0;
		margin: 0 auto;
		background: #fff;
		z-index: 999;
	}
}
#header .inner {
width: 100%;
margin: 0 auto;
}
#header ul.hm {
margin: 0 auto;
display: -webkit-flex;
display: flex;
-webkit-justify-content: space-between;
justify-content: space-between;
align-items: center;
line-height: 1.3em;
}
#header ul.hm .hm1 {
margin: 0 auto 0px 0;
}
#header ul.hm .hm2 {
margin: 0 0px 0 auto;
}
#header ul.hmr {
-webkit-flex-direction: column;
flex-direction: column;
}
#header ul.hmr li.hmr1 {
padding:  0 30px 10px 0;
margin:  0 0 10px auto;
border-bottom: 2px solid #b7b7b7;
text-align: right;
}
#header ul.hmr li.hmr2 {
padding: 0 30px 0 20px;
}
#header .logo {
}
#header .tel1 {
font-size: 20px;
font-weight: bold;
font-family: 'Bahnschrift';
}
#header .tel2 {
margin: 0 20px 0 0;
font-size: 25px;
font-weight: bold;
font-family: 'Bahnschrift';
}
#header .time {
font-size: 13px;
}
#header ul.hmbox {
display: -webkit-flex;
display: flex;
align-items: center;
}
#header .en {
margin: 0 0 0 20px;
border: 2px solid #000;
}
#header .en a {
padding: 10px 20px;
display: block;
}

/* header link
*************/
#header a {
color: #000;
-webkit-transition: all 0.4s ease;
-moz-transition: all 0.4s ease;
-o-transition: all 0.4s ease;
transition: all  0.4s ease;
text-decoration: none;
}
#header a:hover {color:#666; text-decoration: none;}


@media only screen and (min-width: 1200px){
#header .inner {
}
}
@media only screen and (max-width: 1200px){
#header .inner {
width: 98%;
}
#header ul.hm .hm1 {
width: 10%;
}
#header ul.hm .hm2 {
width: 600px;
}
}
@media only screen and (max-width: 767px){
#header ul.hm .hm1 {
width: 80px;
}
#header ul.hm .hm2 {
display: none;
}
}


/* transition */
#header {
-webkit-transition: all .4s ease 0s,background .6s ease .2s;
transition: all .4s ease 0s,background .6s ease .2s;
-webkit-overflow-scrolling: touch;
overflow-scrolling: touch;
}
/* Fixed */
#header.fixed {
-webkit-transition: all .4s ease 0s,background .6s ease .2s;
transition: all .4s ease 0s,background .6s ease .2s;
-webkit-overflow-scrolling: touch;
overflow-scrolling: touch;
}
#header.fixed {
padding: 10px 0 10px 20px;
}
@media only screen and (max-width: 1200px){
}
@media only screen and (min-width: 767px){
}
@media only screen and (max-width: 767px){
}


/* HdrNavi
*************/
nav#HdrNavi {
position: relative;
width: 470px;
margin: 0 auto 0 auto;
z-index: 10;
}
nav#HdrNavi.Fixed {
max-width:initial;
max-width:auto;
width:100%;
position:fixed;
top:0;
left:0;
z-index:100;
}
nav#HdrNavi ul {
display: -webkit-flex;
display: flex;
-webkit-justify-content: space-between;
justify-content: space-between;
}
nav#HdrNavi ul li {
position:relative;
padding: 0;
font-size: 15px;
line-height: 1em;
font-weight: bold;
text-align:center;
font-family: 'Bahnschrift';
}
nav#HdrNavi > ul > li a {
display:block;
-webkit-transition: all 0.4s ease;
-moz-transition: all 0.4s ease;
-o-transition: all 0.4s ease;
transition: all  0.4s ease;
position: relative;
display: inline-block;
text-decoration: none;
}
nav#HdrNavi > ul > li a::after {
position: absolute;
left: 50%;
bottom: -3px;
transform: translateX(-50%);
-webkit-transform: translateX(-50%);
content: '';
width: 50%;
height: 2px;
background: #fed046;
visibility: hidden; /*ホバー前に、アンダーラインを可視化しない*/
}
nav#HdrNavi > ul > li a:hover::after {
visibility: visible; /*ホバー後、アンダーラインを可視化する*/
}
nav#HdrNavi > ul > li a:hover{
text-decoration: none;
-webkit-transition: all 0.4s ease;
-moz-transition: all 0.4s ease;
-o-transition: all 0.4s ease;
transition: all  0.4s ease;
opacity: 0.6;
display:block;
}


/* SubMenu */
nav#HdrNavi ul.SubMenu {
position:absolute;
width: 100px;
text-align:left;
box-sizing:border-box;
top: 20px;
left: 50%;
transform:translateX(-50%);
z-index:20;
opacity: 0;
transition: 0s;
}
nav#HdrNavi > ul > li:hover ul.SubMenu {
display:block;
}
nav#HdrNavi ul.SubMenu li {
text-align: center; /* テキスト位置 */
border: none;
}
nav#HdrNavi li:hover ul {
visibility: visible;
opacity: 1;
}
nav#HdrNavi li:hover ul li a {
visibility: visible;
opacity: 1;
}
nav#HdrNavi ul.SubMenu li a {
padding: 5px 10px;
display:block;
text-decoration: none;
background:rgba(0,0,0,0.8);
color: #fff;
font-size: 13px;
font-weight: 400;
line-height: 1.3em;
border: none;
display:block;
visibility: hidden;
opacity: 0;
-webkit-transition: all 0.4s ease;
-moz-transition: all 0.4s ease;
-o-transition: all 0.4s ease;
transition: all  0.4s ease;
}
nav#HdrNavi ul.SubMenu li a:after {
height: 0;
}
nav#HdrNavi ul.SubMenu li a:hover {
padding: 5px 10px;
color:#000;
background: #ddd;
}


/* HdrNavi link
*************/
nav#HdrNavi a {
color: #080385;
-webkit-transition: all 0.4s ease;
-moz-transition: all 0.4s ease;
-o-transition: all 0.4s ease;
transition: all  0.4s ease;
text-decoration: none;
}
nav#HdrNavi a:hover {color:#666; text-decoration: none;}



@media only screen and (min-width: 1200px){
}
@media only screen and (max-width: 1200px){
nav#HdrNavi {
width: 100%;
}
nav#HdrNavi ul li {
font-size: 13px;
}
nav#HdrNavi ul.SubMenu {
width: 100px;
top: 15px;
}
nav#HdrNavi ul.SubMenu li a {
font-size: 1vw;
}
}
@media only screen and (max-width: 767px){
}

/* footer
*************/
#footer {
position: relative;
width: 100%;
padding: 50px 0 0 0;
background: #080385;
color: #fff;
z-index: 10;
}
#footer .inner {
position: relative;
margin: 0 auto;
}
#footer ul.fm {
display: -webkit-flex;
display: flex;
-webkit-justify-content: space-between;
justify-content: space-between;
}
#footer ul.fm li {
width: 50%;
text-align: left;
}
#footer .logo2 {
margin: 0 0 50px 0;
}
#footer .add2 {
font-size: 13px;
}
#footer ul.fbn {
margin: 0 0 0 auto;
display: -webkit-flex;
display: flex;
-webkit-justify-content: flex-end;
justify-content: flex-end;
-webkit-align-items: flex-end;
align-items: flex-end;
}
#footer ul.fbn li {
width: 30%;
}
#footer ul.fmbox {
display: -webkit-flex;
display: flex;
align-items: center;
}
#footer .en {
width: 200px;
margin: 10px 0 10px 0;
border: 2px solid #fff;
text-align: center;
}
#footer .en a {
padding: 10px 20px;
display: block;
}
#footer ul.fmbox li.fmboxl {
width: 30%;
}
#footer ul.fmbox li.fmboxr {
width: 70%;
}

@media only screen and (min-width: 767px){
#footer .inner {
width: 1200px!important;
}
}
@media only screen and (max-width: 767px){
#footer {
padding: 50px 0 0 0;
}
#footer .inner {
width: 94%!important;
}
#footer ul.fm {
-webkit-flex-direction: column;
flex-direction: column;
}
#footer ul.fm li {
width: 100%;
text-align: center;
}
#footer .logo2 {
margin: 0 0 30px 0;
}
#footer .add2 {
margin: 0 auto 30px auto;
}
#footer ul.fbn {
margin: 0 0;
-webkit-justify-content: space-between;
justify-content: space-between;
}
#footer ul.fbn li {
width: 100%;
}
#footer .en {
margin: 10px auto 10px auto;
}
#footer ul.fmbox {
-webkit-flex-direction: column;
flex-direction: column;
}
#footer ul.fmbox li.fmboxl {
width: 100%;
}
#footer ul.fmbox li.fmboxr {
width: 100%;
text-align: center;
}
}

/* footnav link
*************/
#footer a {
color: #fff;
-webkit-transition: all 0.4s ease;
-moz-transition: all 0.4s ease;
-o-transition: all 0.4s ease;
transition: all  0.4s ease;
text-decoration: none;
}
#footer a:hover {color:#ddd; text-decoration: none;}


/* footnav
*************/
nav#footnav {
position: relative;
margin: 0 auto;
text-align: left;
display: -webkit-flex;
display: flex;
}
nav#footnav .inner {
}
nav#footnav ul.fm2 {
width: 33%;
margin: 0 0 0 0;
}
nav#footnav ul.fm2 li.list1 {
width: 100%;
padding: 0 0 0 0px;
margin: 0 0 7px 0;
font-size: 13px;
}
nav#footnav ul.fm2 li.list2 {
width: 100%;
padding: 0 0 0 8px;
margin: 0 0 5px 0;
font-size: 11px;
background: url("../img/ico_fm2.png") 0 7px no-repeat;
}

@media only screen and (min-width: 767px){
}
@media only screen and (max-width: 767px){
}

/* footnav link
*************/
nav#footnav a {
color: #fff;
-webkit-transition: all 0.4s ease;
-moz-transition: all 0.4s ease;
-o-transition: all 0.4s ease;
transition: all  0.4s ease;
text-decoration: none;
}
nav#footnav a:hover {color:#ddd; text-decoration: none;}


/* copyright link
*************/
.copyright {
padding: 30px 0;
color: #737373;
font-size: 13px;
line-height: 1.3em;
text-align: right;
}

@media only screen and (max-width: 767px){
.copyright {
font-size: 2vw;
}
}

/* 固定ボタン
*************/
.headerGlobalBtn > li > a{
background-repeat: no-repeat;
background-position: 0 0;
display: block;
width: 198px;
height: 198px;
margin: 0;
padding: 0;
text-indent: 100%;
white-space: nowrap;
overflow: hidden;
filter: drop-shadow(0px 0px 5px rgba(0,0,0,0.3));
z-index: 99;
}
.headerGlobalBtn{
width: auto;
position: fixed;
top: 50%;
right: 5%;
z-index: 200;
}
.headerGlobalBtn > li{
display: block;
margin: 0 0 10px 0;
padding: 0;
}

/* headerGbtn1 */
.headerGlobalBtn > .headerGbtn1 > a {
width: 198px;
height: 198px;
background-size: auto;
  -webkit-transition: margin 1s ease;
     -moz-transition: margin 1s ease;
       -o-transition: margin 1s ease;
      -ms-transition: margin 1s ease;
          transition: margin 1s ease;
}
.headerGlobalBtn > .headerGbtn1 > a {
-webkit-transition: all 0.4s ease;
-moz-transition: all 0.4s ease;
-o-transition: all 0.4s ease;
transition: all  0.4s ease;
background-image: url(../img/bn_onlineshop.png);
}
.headerGlobalBtn > .headerGbtn1 > a:hover {
opacity: 0.6;
}

@media only screen and (max-width:767px) {
.headerGlobalBtn > li > a{
width: 98px;
}
.headerGlobalBtn{
top: 30%;
}
}
/* headerGbtn1 */
.headerGlobalBtn > .headerGbtn1 > a {
width: 98px;
height: 98px;
background-image: url(../img/bn_onlineshops.png);
}
}


/* main
------------------------------------------------------------*/
/* mainvisual
*************/
#mainvisual {
position: relative;
width: 100%;
margin: 0 auto;
}

/* top
*************/
#top {
position: relative;
width: 100%;
height: auto;
z-index: 0;
clear: both;
}
#top .inner {
width: 100%;
}
#top .bn_more1 {
margin: 70px auto 0 auto;
text-align: center;
}


@media only screen and (min-width: 1200px){
#top {
padding: 122px 0 0 0;
}
#top .inner {
width: 1220px;
}
}
@media only screen and (max-width: 1200px){
#top {
padding: 122px 0 0 0;
}
#top .inner {
width: 94%;
}
}
@media only screen and (max-width: 767px){
#top {
padding: 88px 0 0 0;
}
}


/* top1 */
#top1 {
position: relative;
width: 100%;
margin: 0 auto;
background: url("../topimg/bg_t1.jpg") top center no-repeat;
}
#top1 .inner {
padding: 150px 200px 150px 200px;
text-align: left;
}
#top1 h2.t1 {
position: relative;
display: inline-block;
margin-bottom: 45px;
font-size: 25px;
font-weight: 400;
line-height: 1.3em;
}
#top1 h2.t1:before {
content: '';
position: absolute;
display: inline-block;
width: 65px;
height: 2px;
top: 18px;
left: -70px;
-webkit-transform: translateX(-50%);
transform: translateX(-50%);
background-color: #fed046;
border-radius: 2px;
}
#top1 h3.t1 {
font-size: 15px;
line-height: 1.7em;
}

ul.pho_t1 {
	display: flex;
	justify-content: flex-start;
/*
gap: 0px;
grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr;
grid-template-rows: 1fr 1fr;
	*/
}
ul.pho_t1 li.pho1 {
/*
grid-column: 1 / 3;
grid-row: 1 / 3;
*/
	width: 50%;
	display: flex;
}
ul.pho_t1 li.w100 {
	width: 100%;
	height: auto;
}


ul.pho_t1 li.pho1 div:first-child{
width: 66.65%
}
ul.pho_t1 li.pho1 div:last-child{
width: 33.4%
}


/*
ul.pho_t1 li.pho2 {
grid-column: 3 / 4;
grid-row: 1 / 3;
	width: 16.7%
}*/

ul.pho_t1 li.pho3 {
/* 
grid-column: 4 / 5;
grid-row: 1 / 3; 
*/
	width: 50%
}

ul.pho_t1 li.pho3 .pho3_1 {
	display: flex;
}
ul.pho_t1 li.pho3 .pho3_2 {
	display: flex;
}

ul.pho_t1 li img {
	width: 100% !important;
	max-width: auto;
	height: auto;
}



/*ul.pho_t1 li.pho4 {
grid-column: 5 / 6;
grid-row: 1 / 3;
}
ul.pho_t1 li.pho5 {
grid-column: 6 / 7;
grid-row: 1 / 3;
}
ul.pho_t1 li.pho6 {
grid-column: 4 / 5;
grid-row: 2 / 3;
}
ul.pho_t1 li.pho7 {
grid-column: 5 / 7;
grid-row: 2 / 3;
}*/


@media only screen and (min-width: 767px){

}
@media only screen and (max-width: 767px){
#top1 .inner {
padding: 50px 0 50px 0;
}
#top1 h2.t1:before {
left: 35px;
top: 120%;
}
}


/* top2 */
#top2 {
position: relative;
width: 100%;
margin: 0 auto;
}
#top2 .inner {
padding: 200px 0;
}
#top2 h2.t2 {
position: relative;
display: inline-block;
margin-bottom: 45px;
font-size: 33px;
line-height: 1.3em;
font-family: 'Bahnschrift';
font-weight: bold;
}
#top2 h2.t2:before {
content: '';
position: absolute;
display: inline-block;
width: 65px;
height: 2px;
top: 18px;
left: -70px;
-webkit-transform: translateX(-50%);
transform: translateX(-50%);
background-color: #fed046;
border-radius: 2px;
}
#top2 h3.t2 {
font-size: 15px;
line-height: 1.7em;
text-align: center;
}
#top2 .t2_1 {
position: relative;
}
#top2 .t2_1 .t2box {
position: absolute;
top: 50%;left: 50%;
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
z-index: 99;
}
#top2 h4.t2 {
color: #fff;
font-size: 55px;
font-weight: bold;
font-family: 'Bahnschrift';
margin: 0 auto 20px auto;
text-shadow: 0 0 1px #919191, 0 0 1px #919191, 0 0 1px #919191;
}
#top2 h5.t2 {
color: #fff;
font-size: 16px;
text-shadow: 0 0 1px #919191, 0 0 1px #919191, 0 0 1px #919191;
}
#top2 .pho_t2 {
}

@media only screen and (min-width: 767px){

}
@media only screen and (max-width: 767px){
#top2 .inner {
padding: 50px 0 50px 0;
}
#top2 h2.t2:before {
top: 110%;
left: 50%;
-webkit-transform: translateX(-50%);
transform: translateX(-50%);
}
#top2 h4.t2 {
margin: 0 auto 0px auto;
font-size: 7vw;
}
#top2 .pho_t2 img {
height: 300px;
object-fit: cover;
}
}


/* top3 */
#top3 {
position: relative;
width: 100%;
padding: 100px 0 100px 0;
margin: 0 auto;
background: #f7f6f3;
}
#top3 h2.t3 {
position: relative;
display: inline-block;
margin-bottom: 45px;
font-size: 33px;
line-height: 1.3em;
font-family: 'Bahnschrift';
font-weight: bold;
}
#top3 h2.t3:before {
content: '';
position: absolute;
display: inline-block;
width: 65px;
height: 2px;
top: 18px;
left: -70px;
-webkit-transform: translateX(-50%);
transform: translateX(-50%);
background-color: #fed046;
border-radius: 2px;
}
#top3 h3.t3 {
margin: 0 auto 50px auto;
font-size: 16px;
}


@media only screen and (min-width: 767px){

}
@media only screen and (max-width: 767px){
#top3 {
padding: 50px 0;
}
#top3 h2.t3:before {
top: 110%;
left: 50%;
-webkit-transform: translateX(-50%);
transform: translateX(-50%);
}
}

/* news */
#news {
position: relative;
width: 70%;
margin: 0 auto;
}
#news .news {
height: 200px;
overflow: auto;
}
#news dl {
width: 100%;
padding: 0 0 20px 0;
margin: 0 auto 20px auto;
display: -webkit-flex;
display: flex;
border-bottom: 1px dashed #000;
}
#news dl dt {
width: 160px;
text-align: left;
}
#news dl dd {
width: calc(100% - 160px);
text-align: left;
}

@media only screen and (min-width: 767px){

}
@media only screen and (max-width: 767px){
#news {
width: 100%;
}
#news dl {
-webkit-flex-direction: column;
flex-direction: column;
}
#news dl dt {
width: 100%;
}
#news dl dd {
width: 100%;
}
}

/* tbuttonbox1 */
.tbuttonbox1 {
width: 100px;
margin: 30px auto 0px auto;
text-align: center;
clear: both;
}
/* tbutton01 */
.tbutton01 {
position: relative;
display: inline-block;
width: 100%;
margin: auto auto 0 auto;
}
.tbutton01 a {
padding: 10px 30px;
text-align:center;
color: #000;
font-size: 13px;
font-weight: 400;
font-family: 'Bahnschrift';
line-height: 1.3em;
text-decoration:none;
display: block;
-webkit-transition: all 0.4s ease;
-moz-transition: all 0.4s ease;
-o-transition: all 0.4s ease;
transition: all  0.4s ease;
background-color: #fff;
border: 2px solid #717171;
z-index: 100;
}
.tbutton01 a:hover {
text-decoration: none;
-webkit-transition: all 0.4s ease;
-moz-transition: all 0.4s ease;
-o-transition: all 0.4s ease;
transition: all  0.4s ease;
color: #fff;
background-color: #000;
border: 2px solid #000;
}
@media only screen and (max-width: 768px) {
.tbutton01 a {
padding: 15px;
font-size: 16px;
}
}

/* tbuttonbox2 */
.tbuttonbox2 {
width: 100px;
margin: 30px auto 0px auto;
text-align: center;
clear: both;
}
/* tbutton02 */
.tbutton02 {
position: relative;
display: inline-block;
width: 100%;
margin: auto auto 0 auto;
}
.tbutton02 a {
padding: 10px 0px;
text-align:center;
/*color: #fff;*/
color: #000;
font-size: 13px;
font-weight: 400;
font-family: 'Bahnschrift';
line-height: 1.3em;
text-decoration:none;
display: block;
-webkit-transition: all 0.4s ease;
-moz-transition: all 0.4s ease;
-o-transition: all 0.4s ease;
transition: all  0.4s ease;
/*border: 1.7px solid #fff;*/
border: 0.5px solid #f0f0f0;
background-color: #fff;
z-index: 100;
text-shadow: 0 0 1px #919191, 0 0 1px #919191, 0 0 1px #919191;
box-shadow: 0 0 1px #bbb, 0 0 1px #bbb, 0 0 1px #bbb;
}
.tbutton02 a:hover {
text-decoration: none;
-webkit-transition: all 0.4s ease;
-moz-transition: all 0.4s ease;
-o-transition: all 0.4s ease;
transition: all  0.4s ease;
/*color: #000;*/
color: #fff;
/*background-color: #fff;*/
background-color: #000;
/*border: 2px solid #fff;*/
border: 0.5px solid #f0f0f0;
}
@media only screen and (max-width: 768px) {
.tbutton02 a {
padding: 15px;
font-size: 16px;
}
}

/* fbuttonbox1 */
.fbuttonbox1 {
width: 160px;
margin: 0 0 0 auto;
text-align: center;
clear: both;
}
/* fbutton01 */
.fbutton01 {
position: relative;
display: inline-block;
width: 100%;
margin: auto auto 0 auto;
}
.fbutton01 a {
padding: 25px;
text-align:center;
line-height: 1em;
text-decoration:none;
display: block;
-webkit-transition: all 0.4s ease;
-moz-transition: all 0.4s ease;
-o-transition: all 0.4s ease;
transition: all  0.4s ease;
border: 2px solid #fff;
z-index: 100;
}
.fbutton01 a:hover {
text-decoration: none;
-webkit-transition: all 0.4s ease;
-moz-transition: all 0.4s ease;
-o-transition: all 0.4s ease;
transition: all  0.4s ease;
color: #fff;
background: #333;
border: 2px solid #fff;
}
.fbutton01 span.ttl {
color: #fed046;
font-size: 13px;
font-weight: 400;
font-family: 'Bahnschrift';
}
.fbutton01 span.sttl {
color: #fff;
font-size: 13px;
font-weight: 400;
}
@media only screen and (max-width: 768px) {
.fbuttonbox1 {
margin: 0 auto 0 auto;
}
.fbutton01 a {
padding: 15px;
font-size: 16px;
}
}


/* tel */
#contents .tel {
font-size: 45px;
line-height: 1.1em;
font-weight: 700;
}
#contents .tel a {
color: #000000;
text-decoration: none;
}
@media only screen and (max-width: 767px){
#contents .tel {
font-size: 6vw;
}
}

/* bn_contact */
#bn_contact {
position: relative;
width: 100%;
margin: 100px auto 100px auto;
text-align: center;
}
#bn_contact .wrap_con {
width: 1100px;
height: 400px;
position: absolute;
top: 50%;left: 50%;
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
align-items: center;
-webkit-transition:	all 0.6s ease;
transition:		all 0.6s ease;
background-color: rgba(0,0,0,0);
padding-top: 0;
z-index: 99;
}
#bn_contact .wrap_con:hover {
background-color: rgba(0,0,0,0.4);
}
#bn_contact .bnconbox {
position: absolute;
top: 50%;left: 50%;
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
z-index: 99;
pointer-events: none;
}
#bn_contact h2.bncon {
position: relative;
display: inline-block;
margin-bottom: 45px;
color: #fff;
font-size: 33px;
line-height: 1.3em;
font-family: 'Bahnschrift';
font-weight: bold;
}
#bn_contact h2.bncon:before {
content: '';
position: absolute;
display: inline-block;
width: 65px;
height: 2px;
left: 50%;
bottom: -15px;
-webkit-transform: translateX(-50%);
transform: translateX(-50%);
background-color: #fed046;
border-radius: 2px;
}
#bn_contact h3.bncon {
color: #fff;
font-size:  16px;
}
#bn_contact .pho_bncon {
}

@media only screen and (max-width: 767px){
#bn_contact .wrap_con {
width: 100%;
height: 300px;
}
#bn_contact .pho_bncon img {
height: 300px;
object-fit: cover;
}
}


/* 吹き出し */
.balloon2 {
position: relative;
display: inline-block;
margin: 1.5em 0;
padding: 7px 10px;
min-width: 120px;
max-width: 100%;
font-size: 15px;
background: #FFF;
border: solid 3px #555;
box-sizing: border-box;
}

.balloon2:before {
content: "";
position: absolute;
bottom: -24px;
left: 50%;
margin-left: -15px;
border: 12px solid transparent;
border-top: 12px solid #FFF;
z-index: 2;
}

.balloon2:after {
content: "";
position: absolute;
bottom: -30px;
left: 50%;
margin-left: -17px;
border: 14px solid transparent;
border-top: 14px solid #555;
z-index: 1;
}


/* table
*************/
table.table {
border-collapse:collapse;
width:100%;
margin:0px auto 0px auto;
clear: both;
}
table.table th {
padding: 20px 20px 20px 0;
border-top:1px solid #000;
border-bottom:1px solid #000;
vertical-align: middle;
font-weight: 400;
}
table.table td {
padding: 20px 0;
border-top:1px solid #c9c9c9;
border-bottom:1px solid #c9c9c9;
vertical-align: middle;
}
table.table th + th {
padding: 20px 20px 20px 0;
border-bottom:1px solid #000;
vertical-align: middle;
font-weight: 400;
}
table.table td + td {
padding: 20px 0;
border-bottom:1px solid #c9c9c9;
vertical-align: middle;
}
table.table .w {
width: 30%;
}
table.table .w2 {
width: 60%;
}
table.table .ct {
}

@media only screen and (max-width: 767px){
/* table
*************/
table.table {
width:100%;
}
table.table th,
table.table td {
width: 100%;
padding: 10px 0;
display: block;
border: none;
}
table.table th {
border-bottom:1px solid #000;
text-align: center;
}
table.table td {
overflow: hidden;
border-bottom:1px solid #c9c9c9;
}
table.table th + th {
padding: 10px 0;
}
table.table td + td {
padding: 10px 0;
}
table.table .w {
width: 100%;
}
table.table .w2 {
width: 100%;
}
table.table .ct {
text-align: center;
}
}

/* table2
*************/
table.table2 {
width: 1050px;
border-collapse:collapse;
margin:0px auto 0px auto;
clear: both;
}
table.table2 th {
padding: 20px;
border-top:1px solid #000;
border-bottom:1px solid #000;
border-right: 1px dashed #000;
text-align: center;
vertical-align: middle;
font-weight: 400;
}
table.table2 th:last-child {
border-right: 1px solid #000;
}
table.table2 th:first-child {
border-left: 1px solid #000;
}
table.table2 td {
padding: 20px;
border-top:1px solid #c9c9c9;
border-bottom:1px solid #c9c9c9;
border-right: 1px dashed #c9c9c9;
vertical-align: middle;
}
table.table2 td:last-child {
border-right: 1px solid #c9c9c9;
}
table.table2 td:first-child {
border-left: 1px solid #c9c9c9;
}
table.table2 .w {
width: 30%;
}
table.table2 .w2 {
width: 20%;
}
table.table2 .color1 {
background: #f6f6f6;
}


@media only screen and (max-width: 767px){
table.table2 th {
padding: 10px;
}
table.table2 td {
padding: 10px;
}
}

/* table2_2 */
table.table2_2 {
width: 100%;
border-collapse:collapse;
margin:0px auto 0px auto;
clear: both;
}
table.table2_2 th {
padding: 07px;
border-top:1px solid #000;
border-bottom:1px solid #000;
border-right: 1px solid #000;
vertical-align: middle;
background: #fff;
font-weight: 400;
width: 150px;
}
table.table2_2 th:last-child {
border-right: 1px solid #000;
}
table.table2_2 th:first-child {
border-left: 1px solid #000;
}
table.table2_2 td {
padding: 20px;
border-top:1px solid #c9c9c9;
border-bottom:1px solid #c9c9c9;
border-right: 1px dashed #c9c9c9;
vertical-align: middle;
}
table.table2_2 td:last-child {
border-right: 1px solid #c9c9c9;
}
table.table2_2 td:first-child {
border-left: 1px solid #c9c9c9;
}
table.table2_2 .w {
width: 20%;
}
table.table2_2 .w2 {
width: 30%;
}

@media only screen and (max-width: 767px){
table.table2_2 {
width:100%;
border-bottom:1px solid #c9c9c9;
}
table.table2_2 th {
padding: 20px;
border-top:1px solid #000;
border-right: 1px solid #000;
border-bottom: none;
text-align: center;
display: block;
width: 100%;
}
table.table2_2 td {
padding: 20px;
border-top: 1px solid #000;
border-right:1px solid #c9c9c9;
border-left:1px solid #c9c9c9;
border-bottom: none;
display: block;
}
table.table2_2 th {
padding: 10px;
}
table.table2_2 td {
padding: 10px;
}
table.table2_2 .w {
width: 100%;
}
table.table2_2 .w2 {
width: 100%;
}
}


/* table3
*************/
table.table3 {
border-collapse:collapse;
width:100%;
margin:0px auto 0px auto;
clear: both;
}
table.table3 th {
padding: 20px;
border-top:1px solid #000;
border-bottom:1px solid #000;
border-right: 1px dashed #000;
text-align: center;
vertical-align: middle;
font-weight: 400;
}
table.table3 th:last-child {
border-right: 1px solid #000;
}
table.table3 th:first-child {
border-left: 1px solid #000;
}
table.table3 td {
padding: 20px;
border-top:1px solid #c9c9c9;
border-bottom:1px solid #c9c9c9;
border-right: 1px dashed #c9c9c9;
vertical-align: middle;
}
table.table3 td:last-child {
border-right: 1px solid #c9c9c9;
}
table.table3 td:first-child {
border-left: 1px solid #c9c9c9;
}
table.table3 .w {
width: 30%;
}

@media only screen and (max-width: 767px){
table.table3 th {
padding: 10px;
}
table.table3 td {
padding: 10px;
}
}

/* block3_3
*************/
table.block3_3 {
border-collapse:collapse;
width:100%;
margin:0px auto 0px auto;
border-top:1px solid #bdbdbd;
clear: both;
}
table.block3_3 th {
padding: 10px;
vertical-align: middle;
background: #92e1ff;
border-bottom:1px solid #bdbdbd;
border-right:1px solid #bdbdbd;
border-left:1px solid #bdbdbd;
text-align: center;
font-weight: 400;
}
table.block3_3 td {
padding: 10px;
border-top:1px solid #bdbdbd;
border-bottom:1px solid #bdbdbd;
border-right:1px solid #bdbdbd;
border-left:1px solid #bdbdbd;
vertical-align: middle;
}
table.block3_3 th + th {
padding: 10px;
vertical-align: middle;
border-bottom:1px solid #bdbdbd;
border-right:1px solid #bdbdbd;
border-left:1px solid #bdbdbd;
text-align: center;
font-weight: 400;
}
table.block3_3 td + td {
padding: 10px;
border-bottom:1px solid #bdbdbd;
border-right:1px solid #bdbdbd;
border-left:1px solid #bdbdbd;
vertical-align: middle;
}
table.block3_3 .w {
width: 20%;
}
table.block3_3 .w2 {
width: 20%;
color: #000;
background: #92e1ff;
}

@media only screen and (max-width: 767px){
/* block3_3
*************/
table.block3_3 {
width:100%;
}
table.block3_3 th,
table.block3_3 td {
width: 100%;
padding: 10px 10px;
display: block;
border: none;
}
table.block3_3 th {
text-align: center;
border-left:1px solid #bdbdbd;
border-right:1px solid #bdbdbd;
border-bottom:1px solid #bdbdbd;
background: #92e1ff;
}
table.block3_3 td {
overflow: hidden;
border-bottom:1px solid #bdbdbd;
border-left:1px solid #bdbdbd;
border-right:1px solid #bdbdbd;
}
table.block3_3 th + th {
padding: 10px 10px;
border-left:1px solid #bdbdbd;
border-right:1px solid #bdbdbd;
}
table.block3_3 td + td {
padding: 10px 10px;
border-left:1px solid #bdbdbd;
border-right:1px solid #bdbdbd;
}
table.block3_3 .w {
width: 100%;
}
table.block3_3 .w2 {
width: 100%;
}
}


/* table4
*************/
table.table4 {
border-collapse:collapse;
width:100%;
margin:0px auto 0px auto;
border-top:1px solid #999;
clear: both;
}
table.table4 th {
padding: 10px 20px;
vertical-align: middle;
background: #f6f6f6;
border-bottom:1px solid #999;
border-right:1px solid #999;
border-left:1px solid #999;
font-weight: 400;
}
table.table4 td {
padding: 10px 20px;
border-top:1px solid #999;
border-bottom:1px solid #999;
border-right:1px solid #999;
border-left:1px solid #999;
vertical-align: middle;
}
table.table4 th + th {
padding: 10px 20px;
vertical-align: middle;
border-bottom:1px solid #999;
border-right:1px solid #999;
border-left:1px solid #999;
font-weight: 400;
}
table.table4 td + td {
padding: 10px 20px;
border-bottom:1px solid #999;
border-right:1px solid #999;
border-left:1px solid #999;
vertical-align: middle;
}
table.table4 .w {
width: 20%;
}
table.table4 .w2 {
width: 30%;
}

table.table4.dealer_sp tr td:first-child a::after{
	content: "";
	display: inline-block;
	vertical-align: middle;
	background-image: url("../img/webicon.svg");
	background-repeat: no-repeat;
	background-position: top 0px left 1px;
	margin-left: 0.5em;
	width: 20px;
	height: 20px;
	background-size: 17px 17px;
}
table.table4.dealer_sp tr td:first-child a:hover::after{
	opacity: 0.5;
}

@media only screen and (max-width: 767px){
/* table
*************/
table.table4 {
width:100%;
}
table.table4 th,
table.table4 td {
width: 100%;
padding: 10px 10px;
display: block;
border: none;
}
table.table4 th {
text-align: center;
border-left:1px solid #999;
border-right:1px solid #999;
border-bottom:1px solid #999;
background: #f1f1f1;
}
table.table4 td {
overflow: hidden;
border-bottom:1px solid #999;
border-left:1px solid #999;
border-right:1px solid #999;
}
table.table4 th + th {
padding: 10px 10px;
border-left:1px solid #999;
border-right:1px solid #999;
}
table.table4 td + td {
padding: 10px 10px;
border-left:1px solid #999;
border-right:1px solid #999;
}
table.table4 .w {
width: 100%;
}
table.table4 .w2 {
width: 100%;
}
table.table4 .w3 {
width: 100%;
}
table.table4 .w4 {
width: 100%;
}

table.table4.dealer_sp {
		border-top: none !important;
	}	
	
	
table.table4.dealer_sp th{
	display: none !important;
	}

	
table.table4.dealer_sp tr {
	margin-bottom: 10px !important;
	display: block;
	border: 1px solid #999 !important;
	}	
	
table.table4.dealer_sp tr:first-child {
		border: none !important;
		display: none;
	}	
	
table.table4.dealer_sp tr td {
	border-bottom: none !important;
border-left: none !important;
border-right: none !important;
	}	
	
table.table4.dealer_sp tr td:first-child{
	font-weight: 600;
	font-weight: bold;
	border-bottom: none !important;
	font-size: 1.2rem;
	padding-bottom: 0px !important;
	}
table.table4.dealer_sp tr td:nth-child(2){
	border-bottom: none !important;
	padding-bottom: 0px !important;
	}	
}


/* form
*************/
.input {
width: 100%;
}
.hisu {
padding: 0 2% 0 2%;
margin: 0px 0px 0px 10px;
color: #ffffff;
font-size: 11px;
background: #e60012;
}
.submit {
margin: 30px auto 0 auto;
text-align: center;
}
.submit input{
-webkit-transition: all 0.4s ease;
-moz-transition: all 0.4s ease;
-o-transition: all 0.4s ease;
transition: all  0.4s ease;
}
.submit input:hover{
opacity: 0.7;
filter: alpha(opacity=70);
-ms-filter: "alpha(opacity=70)";
text-decoration: none;
-webkit-transition: all 0.4s ease;
-moz-transition: all 0.4s ease;
-o-transition: all 0.4s ease;
transition: all  0.4s ease;
}
.c-form-1 input[type="text"], .c-form-1 input[type="email"], .c-form-1 textarea {
border-radius: 3px;
border: solid 1px #dddddd;
background-color: #fff;
width: 100%;
padding: .8em;
}
.c-form-1 textarea {
min-height: 10em;
width: 100%;
}

.c-form-2 input[type="text"], .c-form-2 input[type="email"], .c-form-2 textarea {
border-radius: 3px;
border: solid 1px #dddddd;
background-color: #f7f7f7;
padding: .8em;
width: 20%;
}
.c-form-2 textarea {
min-height: 10em;
width: 20%;
}

/*Radio Check*/
label.radio, label.radio_text, label.checkbox, label.checkbox_text {
position      : relative;
cursor        : pointer;
display       : inline-block;
overflow      : hidden;
box-sizing    : border-box;
}
label.radio {
width         : 18px;
height        : 18px;
border        : 1px solid #666666;
border-radius : 100%;
}
label.radio_text {
min-height   : calc(18px + 5px);
margin-right : calc(18px + 5px);
padding-left : calc(18px + 5px);
line-height  : calc(18px + 5px);
}
label.checkbox {
width      : 20px;
height     : 20px;
border     : 1px solid #B3B3B3;
background : #fff;
}
label.checkbox_text {
padding-left : calc(20px + 5px);
line-height  : 20px;
}
/** before after **/
label.radio:before, label.radio_text:before, label.checkbox_text:before,
label.checkbox:after, label.radio_text:after, label.checkbox_text:after{
content  : '';
position : absolute;
box-sizing : border-box;
}
label.radio:before, label.radio_text:before{
border-radius    : 100%;
}
label.radio:before, label.checkbox:after{
top              : 0px;
bottom           : 0px;
left             : 0px;
right            : 0px;
margin           : auto;
}
label.checkbox:after, label.checkbox_text:after{
transform         : rotate(45deg);
-webkit-transform : rotate(45deg);
-moz-transform    : rotate(45deg);
border-right      : 3px solid #444;/* 色変更 */
border-bottom     : 3px solid #444;/* 色変更 */
top               : calc(50% - (((17px / 12 ) * 5) / 2));
display           : block;
margin-top        : calc(((17px / 12 ) * 5) * -1);
width             : calc(((17px / 12 ) * 5));
height            : 17px;
z-index           : 1;
}
label.radio_text:before, label.radio_text:after{
top              : 0px;
bottom           : 0px;
margin-top       : auto;
margin-bottom    : auto;
}
label.radio:before {
display          : block;
width            : 10px;
height           : 10px;
z-index          : 1;
background-color : #89d2de; 
}
label.radio_text:before {
width         : 18px;
height        : 18px;
border        : 1px solid #666666;
left          : 0px;
z-index       : 3;
}
label.checkbox_text:before {
width    : 20px;
height   : 20px;
left     : 0px;
top      : 0;
border   : 1px solid #B3B3B3;
z-index  : 3;
box-sizing: border-box;
}
label.radio_text:after {
width            : 10px;
height           : 10px;
border-radius    : 100%;
left             : calc(((18px/2) - (10px) / 2));
background-color : #444;/* 色変更 */
z-index          : 1;
}
label.checkbox_text:after {
left : calc((20px / 2) - (((17px / 12 ) * 5) / 2));
}
/** input **/
label.radio input[type="radio"], label.radio_text input[type="radio"], label.checkbox input[type="checkbox"], label.checkbox_text input[type="checkbox"]{
-moz-appearance: none;
-webkit-appearance: none;
position   : absolute;
z-index    : 2;
margin     : 0px;
width      : 20px;
height     : 20px;
box-sizing    : border-box;
outline       : none;
}
label.radio input[type="radio"], label.radio_text input[type="radio"]{
left       : calc(18px * -1);
width      : 18px;
height     : 18px;
top           : 0px;
bottom        : 0px;
margin-top    : auto;
margin-bottom : auto;
border-radius : 100%;
}
label.checkbox input[type="checkbox"], label.checkbox_text input[type="checkbox"]{
left       : calc(20px * -1);
padding    : 0;
}
label.radio input[type="radio"] {
display    : block;
box-shadow : 18px 0px #FFF;
}
label.radio_text input[type="radio"] {
box-shadow : 18px 0px #FFF;
}
label.checkbox input[type="checkbox"] {
box-shadow : 20px 0px #FFF;
}
label.checkbox_text input[type="checkbox"] {
display    : block;
box-shadow : 20px 0px #FFF;
}
/** checked forcus */
label.checkbox_text input[type="checkbox"]:checked,
label.checkbox input[type="checkbox"]:checked,
label.radio_text input[type="radio"]:checked,
label.radio input[type="radio"]:checked{
box-shadow : none;
}
label.checkbox_text input[type="checkbox"]:checked:focus,
label.checkbox input[type="checkbox"]:checked:focus{
opacity: 0.1;
}
label.radio_text input[type="radio"]:focus,
label.radio input[type="radio"]:focus{
opacity: 0.2;
}

label.checkbox_text input[type="checkbox"]:checked:focus {
box-shadow : 20px 0px #666;
}
label.checkbox_text input[type="checkbox"]:focus {
box-shadow : 20px 0px #EEE;
}
label.checkbox input[type="checkbox"]:checked:focus {
box-shadow : 20px 0px #666;
}
label.checkbox input[type="checkbox"]:focus {
box-shadow : 20px 0px #EEE;
}
label.radio_text input[type="radio"]:focus {
box-shadow : 18px 0px #FFF;
}
label.radio input[type="radio"]:focus {
box-shadow : 18px 0px #FFF;
}


/* form txt */
input[type=text] {
font-size: 100%;
font-weight: 300;
font-family: 'Noto Sans JP', "メイリオ", sans-serif;
}
textarea {
font-size: 100%;
font-weight: 300;
font-family: 'Noto Sans JP', "メイリオ", sans-serif;
}


/* selectlist */
.selectlist {
overflow: hidden;
text-align: left;
}
.selectlist select {
width: 100%;
padding-right: 1em;
cursor: pointer;
text-indent: 0.01px;
text-overflow: ellipsis;
border: none;
outline: none;
background: transparent;
background-image: none;
box-shadow: none;
-webkit-appearance: none;
appearance: none;
font-size: 16px;
}
.selectlist select::-ms-expand {
display: none;
}
.selectlist.cp01 {
position: relative;
border: 1px solid #bbbbbb;
border-radius: 3px;
background: #ffffff;
}
.selectlist.cp01::before {
position: absolute;
top: 1.2em;
right: 0.9em;
width: 0;
height: 0;
padding: 0;
content: '';
border-left: 6px solid transparent;
border-right: 6px solid transparent;
border-top: 6px solid #666666;
pointer-events: none;
}
.selectlist.cp01 select {
padding: 10px 20px 10px 10px;
color: #666666;
}


.selectlist2 {
width: 200px;
overflow: hidden;
text-align: left;
}
.selectlist2 select {
width: 100%;
padding-right: 1em;
cursor: pointer;
text-indent: 0.01px;
text-overflow: ellipsis;
border: none;
outline: none;
background: transparent;
background-image: none;
box-shadow: none;
-webkit-appearance: none;
appearance: none;
font-size: 16px;
}
.selectlist2 select::-ms-expand {
display: none;
}
.selectlist2.cp02 {
position: relative;
border: 1px solid #bbbbbb;
border-radius: 3px;
background: #ffffff;
}
.selectlist2.cp02::before {
position: absolute;
top: 1.2em;
right: 0.9em;
width: 0;
height: 0;
padding: 0;
content: '';
border-left: 6px solid transparent;
border-right: 6px solid transparent;
border-top: 6px solid #666666;
pointer-events: none;
}
.selectlist2.cp02 select {
padding: 10px 20px 10px 10px;
color: #666666;
}

@media screen and (max-width: 767px) {
.selectlist2 {
width: 100%;
}
}

/* form横並び */
ul.wrap_form {
display: -webkit-flex;
display: flex;
-webkit-justify-content: space-between;
justify-content: space-between;
align-items: center;
}
ul.wrap_form li.wforml {
width: 95%;
}
ul.wrap_form li.wformr {
width: 5%;
text-align: center;
}


/* googlemap
*************/
.ggmap {
height: 0;
overflow: hidden;
padding-bottom: 50%;
position: relative;
}
.ggmap iframe,
.ggmap object,
.ggmap embed {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}

.ggmap2 {
height: 0;
overflow: hidden;
padding-bottom: 25%;
position: relative;
}
.ggmap2 iframe,
.ggmap2 object,
.ggmap2 embed {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}

/* googleカレンダー
*************/
.googlecal {
position: relative;
padding-bottom: 100%; /* 縦横比 */
height: 0;
}
.googlecal iframe {
position: absolute;
top: 0;
left: 0;
width: 100% !important;
height: 100% !important;
}
/* 画面幅が768px以上の場合の縦横比の指定 */
@media only screen and (min-width: 768px) {
.googlecal { padding-bottom: 75%; }
}

/* youtube
*************/
.youtube {
position: relative;
width: 100%;
padding-top: 56.25%;
}
.youtube iframe {
position: absolute;
top: 0;
right: 0;
width: 100% !important;
height: 100% !important;
}

/* facebook
*************/
.fb_iframe_widget,
.fb_iframe_widget span,
.fb_iframe_widget iframe[style]{
width: 100% !important;
}


/* title
*************/
.page-visual-ttl {
position: relative;
width: 100%;
margin: 0 auto 5% auto;
clear: both;
}
.page-visual-ttl .img_title {
position: absolute;
z-index: 9;
}
.page-visual-ttl .page-visual {
max-width: 1050px;
width: 100%;
position: absolute;
padding: 1% 5%;
left: 50%;
bottom: 0;
transform: translateX(-50%);
-webkit-transform: translateX(-50%);
background: rgba(0,0,0,.6);
z-index: 10;
}
.page-visual-ttl .jp {
position: relative;
display: inline-block;
margin-bottom: .5em;
color: #fff;
font-size: 37px;
line-height: 1em;
font-weight: 700;
font-family: 'Bahnschrift';
}
.page-visual-ttl .jp:before {
content: '';
position: absolute;
bottom: -12px;
display: inline-block;
width: 150px;
height: 1px;
left: 50%;
-webkit-transform: translateX(-50%);
transform: translateX(-50%);
background-color: #f0c645;
}
.page-visual-ttl .en {
color: #999;
font-size: 13px;
font-weight: 400;
display: block;
}

@media only screen and (max-width:767px){
}
@media only screen and (max-width:767px){
.page-visual-ttl {
margin: 0 0 50px 0;
}
.page-visual-ttl .page-visual {
padding: 25px 0 15px 0;
}
.page-visual-ttl .jp {
font-size: 30px;
}
	
.page-visual-ttl .jp h2 {
	
	}	
	
.page-visual-ttl .pho img {
height: 200px;
object-fit: cover;
}
}


/* 見出し
*************/
.h3 {
margin: 0 auto 70px auto;
font-size: 32px;
line-height: 1.3em;
text-align: left;
font-weight: 700;
clear: both;
}
.h3 h3 {
position: relative;
display: inline-block;
padding: 0 55px 0 0px;
}
.h3 h3::after{
content: '';
position: absolute;
top: 50%;
display: inline-block;
width: 45px;
height: 1px;
background-color: black;
}


.h3 h3::before {left:0;}
.h3 h3::after {right: 0;}
.h3 .en {
margin: 10px auto 0 auto;
color: #999;
font-size: 13px;
line-height: 1.3em;
text-align: center;
font-weight: bold;
}
.h3 .data {
color: #666;
font-size: 12px;
line-height: 1.5em;
}

@media screen and (max-width:767px){
	
	.h3 h3::before, .h3 h3::after{
width: 20px;
}
	
	.h3 h3 {
  padding: 0 30px 0 30px;
}
	
}


.h4 {
margin:  0 0 0 0;
position:  relative;
font-size: 20px;
font-weight: 400;
color:  #000;
text-align: left;
padding: 10px 15px 10px 15px;
margin-bottom:  20px;
border: 1px solid #000;
}
.h4:before {
content: '';
position: absolute;
display: inline-block;
width: 20px;
height: 20px;
left: 10px;
top: -10px;
}

.h5 {
position: relative;
padding: 0px 0 10px 15px;
margin: 0 0 20px 0;
font-size: 18px;
line-height: 1.3em;
text-align: left;
font-weight: 400;
border-bottom: 1px dashed #333;
clear: both;
}
.h5:before {
content: '';
position: absolute;
display: inline-block;
width: 10px;
height: 2px;
left: 0;
top: 13px;
background: url(../img/ico_h5.png) 0 0 no-repeat;
}

.h5_2 {
position: relative;
padding: 0px 0 10px 15px;
margin: 0 0 20px 0;
font-size: 18px;
line-height: 1.3em;
text-align: left;
font-weight: 400;
border-bottom: 1px solid #ccc;
clear: both;
}
.h5_2:before {
content: '';
position: absolute;
display: inline-block;
width: 10px;
height: 10px;
left: 0;
top: 8px;
background: url(../img/ico_h5.png) 0 0 no-repeat;
}


@media only screen and (min-width: 767px){
.h3,
.h4,
.h5 {
width: 1050px;
}
}

@media only screen and (max-width: 767px){
.h3,
.h4,
.h5 {
width: 100%;
}
.h3 {
font-size: 26px;
}
}


/* カラム
*************/
.content2 ul {
	text-align: left !important;
    display: flex !important;
    justify-content: flex-start !important;
    flex-wrap: nowrap;
    flex-direction: column;
}

#contents .col1 {
text-align: center;
}
#contents .col2 {
position: relative;
margin: 0 3% 5% 0;

width: 47%;

}
#contents .col3 {
position: relative;
margin: 0 3% 5% auto;
width: 30%;

text-align: left;
}
#contents .col4 {
position: relative;
margin: 0 3% 5% 0;
width: 22%;
text-align: left;

}
#contents .col5 {
position: relative;
margin: 0 3% 5% 0;
width: 17%;
text-align: left;

}
#contents .col6 {
position: relative;
margin: 0 3% 5% 0;
width: 13.6%;

}
#contents .col1 p,
#contents .col2 p,
#contents .col3 p,
#contents .col4 p,
#contents .col5 p,
#contents .col6 p{
padding: 5px 0 0 0;
line-height: 1.5em;
}
#contents p {
text-align: left;
}
#contents p.center {
text-align: center;
}
#contents .col5 ul.tag {
position: absolute;
left: 0;
top: 0;
pointer-events: none;
z-index: 99;
}


.wcedit_40020B818301 #contents .col5 .tag {
	position: static !important;
	pointer-events: all !important;
	display: block;
	margin-bottom: 8px;
}

.wcedit_40020B818301 #contents .col5 .ImgBox {
  background: #fff !important;

}

/* ボタン下揃え */
#contents .col3.sp {
padding: 0 0 70px 0;
}

/* 装飾デザイン
*************/
/* box_line */
.box_line1 {
position: relative;
padding: 2em 2em;
}
.box_line1:before,.box_line1:after{ 
content:'';
width: 20%;
height: 30%;
position: absolute;
display: inline-block;
}
.box_line1:before{
border-left: solid 1px #333;
border-top: solid 1px #333;
top:0;
left: 0;
}
.box_line1:after{
border-right: solid 1px #333;
border-bottom: solid 1px #333;
bottom:0;
right: 0;
}
.box_line2 {
padding: 2em;
width: 100%;
border: 10px dotted #9167b2; /*太さ・線種・色*/
background-color: #fff; /* 背景色 */
border-radius: 1px; /*角の丸み*/
}


/* ボタン */
.buttonbox1 {
margin: 40px auto 0px auto;
text-align: center;
clear: both;
}
.buttonbox2 {
margin: 20px auto 0px 0;
text-align: center;
clear: both;
}
.buttonbox3 {
width: 100%;
margin: 0px auto;
text-align: center;
clear: both;
}
.buttonbox4 {
margin: 40px auto 0px auto;
text-align: center;
clear: both;
}


@media only screen and (min-width: 767px) {
.buttonbox1 {
width: 300px;
}
.buttonbox2 {
width: 300px;
}
.buttonbox4 {
width: 300px;
}
}
@media only screen and (max-width: 767px) {
.buttonbox1 {
width: 80%;
}
.buttonbox2 {
width: 80%;
margin: 0px auto 10px auto;
}
.buttonbox3 {
width: 80%;
}
.buttonbox4 {
width: 80%;
}
}



/* button01 */
.button01 {
position: relative;
display: inline-block;
width: 100%;
margin: 0 auto 0 auto;
}
.button01 a {
padding: 15px;
text-align:center;
color: #fff;
font-size: 15px;
font-weight: 400;
line-height: 1.3em;
text-decoration:none;
display: block;
-webkit-transition: all 0.4s ease;
-moz-transition: all 0.4s ease;
-o-transition: all 0.4s ease;
transition: all  0.4s ease;
background: #080385;
border-radius: 30px;
-webkit-border-radius: 30px;
-moz-border-radius: 30px;
z-index: 100;
}
.button01::after {
position: absolute;
top: 50%;
right: 15px;
content: '';
margin-top: -5px;
transition: all .3s;
width: 8px;
height: 8px;
border-top: 2px solid #fff;
border-right: 2px solid #fff;
-webkit-transform: rotate(45deg);
transform: rotate(45deg);
pointer-events: none;
}
.button01 a:hover {
text-decoration: none;
-webkit-transition: all 0.4s ease;
-moz-transition: all 0.4s ease;
-o-transition: all 0.4s ease;
transition: all  0.4s ease;
color: #000;
background-color: #fed047;
}
.button01:hover::after {
border-top: 2px solid #000;
border-right: 2px solid #000;
}
@media only screen and (max-width: 768px) {
.button01 a {
padding: 15px;
font-size: 16px;
}
}

/* button02 */
.button02 {
position: relative;
display: inline-block;
width: 100%;
margin: auto auto 0 auto;
}
.button02 a {
padding: 13px;
text-align:left;
color: #fff;
font-size: 15px;
font-weight: bold;
line-height: 1.3em;
text-decoration:none;
display: block;
-webkit-transition: all 0.4s ease;
-moz-transition: all 0.4s ease;
-o-transition: all 0.4s ease;
transition: all  0.4s ease;
background-color: #5ac0c4;
border: 1px solid #5ac0c4;
border-radius: 5px;-webkit-border-radius: 5px;-moz-border-radius: 5px;
z-index: 100;
}
.button02::after {
position: absolute;
top: 50%;
right: 15px;
content: '';
margin-top: -5px;
transition: all .3s;
width: 8px;
height: 8px;
border-top: 2px solid #fff;
border-right: 2px solid #fff;
-webkit-transform: rotate(45deg);
transform: rotate(45deg);
pointer-events: none;
}
.button02 a:hover {
text-decoration: none;
-webkit-transition: all 0.4s ease;
-moz-transition: all 0.4s ease;
-o-transition: all 0.4s ease;
transition: all  0.4s ease;
color: #5ac0c4;
background-color: #fff;
border: 1px solid #5ac0c4;
}
.button02:hover::after {
border-top: 2px solid #5ac0c4;
border-right: 2px solid #5ac0c4;
}
@media only screen and (max-width: 768px) {
.button02 a {
padding: 15px;
font-size: 16px;
}
}


/* 色ボタンレイアウト */
.menucol1 {
width: 40%;
margin: 0 auto;
text-align: center;
}
.menucol2 {
margin: 0 3% 2% 0;
width: 47%;
text-align: left;
float: left;
}
.menucol3 {
margin: 0 3% 2% 0;
width: 30%;
text-align: left;
float: left;
}
.menucol4 {
margin: 0 3% 2% 0;
width: 22%;
text-align: left;
float: left;
}
@media only screen and (min-width: 767px){
.menucol2 {
width: 505px;
margin-right: 40px;
}
.menucol3 {
width: 250px;
margin-right: 21px;
}
.menucol4 {
width: 246px;
margin-right: 22px;
}
}
@media only screen and (max-width: 767px){
.menucol1 {
width: 100%;
}
.menucol2 {
margin: 0 3% 3% 0;
width: 100%;
}
.menucol3 {
margin: 0 3% 3% 0;
width: 100%;
}
.menucol4 {
margin: 0 3% 3% 0;
width: 100%;
}
}

/* フレキシブルボックス
*************/

/* 中央揃え　画像上テキスト下 */
.wrapbox {
width: 100%;
display: -webkit-flex;
display: flex;
-webkit-align-items: center; /* 縦方向中央揃え（Safari用） */
align-items: center; /* 縦方向中央揃え */
-webkit-justify-content: center; /* 横方向中央揃え（Safari用） */
justify-content: center; /* 横方向中央揃え */
-webkit-justify-content: space-between;
justify-content: space-between;
}
/* 中央揃え　画像上テキスト下　レスポンシブ逆 */
.wrapbox2 {
width: 100%;
display: -webkit-flex;
display: flex;
-webkit-align-items: center; /* 縦方向中央揃え（Safari用） */
align-items: center; /* 縦方向中央揃え */
-webkit-justify-content: center; /* 横方向中央揃え（Safari用） */
justify-content: center; /* 横方向中央揃え */
}
/* 上揃え　画像上テキスト下 */
.wrapbox3 {
width: 100%;
display: -webkit-flex;
display: flex;
-webkit-align-items: flex-start; /* 縦方向中央揃え（Safari用） */
align-items: flex-start; /* 縦方向中央揃え */
-webkit-justify-content: center; /* 横方向中央揃え（Safari用） */
justify-content: center; /* 横方向中央揃え */
-webkit-justify-content: space-between;
justify-content: space-between;
}
/* 上揃え　画像上テキスト下　レスポンシブ逆 */
.wrapbox4 {
width: 100%;
display: -webkit-flex;
display: flex;
-webkit-align-items: flex-start; /* 縦方向中央揃え（Safari用） */
align-items: flex-start; /* 縦方向中央揃え */
-webkit-justify-content: center; /* 横方向中央揃え（Safari用） */
justify-content: center; /* 横方向中央揃え */
-webkit-justify-content: space-between;
justify-content: space-between;
}
/* 中央揃え　画像上テキスト下　レスポンシブなし */
.wrapbox5 {
width: 100%;
display: -webkit-flex;
display: flex;
-webkit-align-items: center; /* 縦方向中央揃え（Safari用） */
align-items: center; /* 縦方向中央揃え */
-webkit-justify-content: center; /* 横方向中央揃え（Safari用） */
justify-content: center; /* 横方向中央揃え */
-webkit-justify-content: space-between;
justify-content: space-between;
}
/* 中央揃え　画像上テキスト下 */
.wrapbox6 {
width: 100%;
display: -webkit-flex;
display: flex;
align-items: center; /* 縦方向中央揃え */
-webkit-justify-content: center; /* 横方向中央揃え（Safari用） */
justify-content: center; /* 横方向中央揃え */
-webkit-justify-content: space-between;
justify-content: space-between;
}
/* 中央揃え　画像上テキスト下 レスポンシブなし */
.wrapbox7 {
width: 100%;
display: -webkit-flex;
display: flex;
-webkit-align-items: center; /* 縦方向中央揃え（Safari用） */
align-items: center; /* 縦方向中央揃え */
-webkit-justify-content: center; /* 横方向中央揃え（Safari用） */
justify-content: center; /* 横方向中央揃え */
-webkit-justify-content: space-between;
justify-content: space-between;
}
/* 上揃え レスポンシブなし */
.wrapbox8 {
width: 100%;
display: -webkit-flex;
display: flex;
-webkit-align-items: flex-start; /* 縦方向中央揃え（Safari用） */
align-items: flex-start; /* 縦方向中央揃え */
-webkit-justify-content: center; /* 横方向中央揃え（Safari用） */
justify-content: center; /* 横方向中央揃え */
-webkit-justify-content: space-between;
justify-content: space-between;
}
/* 上揃え レスポンシブなし */
.wrapbox9 {
width: 80%;
margin: 0 auto;
display: -webkit-flex;
display: flex;
-webkit-align-items: flex-start; /* 縦方向中央揃え（Safari用） */
align-items: flex-start; /* 縦方向中央揃え */
-webkit-justify-content: center; /* 横方向中央揃え（Safari用） */
justify-content: center; /* 横方向中央揃え */
-webkit-justify-content: space-between;
justify-content: space-between;
}
/* 中央揃え レスポンシブなし */
.wrapbox10 {
width: 100%;
display: -webkit-flex;
display: flex;
-webkit-align-items: center; /* 縦方向中央揃え（Safari用） */
align-items: center; /* 縦方向中央揃え */
-webkit-justify-content: center; /* 横方向中央揃え（Safari用） */
justify-content: center; /* 横方向中央揃え */
-webkit-justify-content: space-between;
justify-content: space-between;
}



.wrap1 {
width: 10%;
}
.wrap1_2 {
width: 12%;
}
.wrap2 {
position: relative;
width: 20%;
}
.wrap2_5 {
width: 25%;
}
.wrap3 {
width: 30%;
}
.wrap3_2 {
width: 35%;
}
.wrap4 {
width: 40%;
}
.wrap4_2 {
width: 45%;
}
.wrap5 {
width: 50%;
}
.wrap5_2 {
width: 55%;
}
.wrap6 {
width:60%;
}
.wrap6_2 {
width:65%;
}
.wrap7 {
width: 70%;
}
.wrap8 {
width: 80%;
}
.wrap9 {
width: 90%;
}

/* 線 */
.line1 {
padding: 10px 0 10px 0;
border-bottom: 3px solid #ccc;
}

/* 影 */
.shadow {
margin: 0 auto 0px auto;
}
.shadow img {
box-shadow: 0 0 10px rgba(0,0,0,0.2);
}

/* 矢印 */
.wrapar1 {
width: 64px;
height: 64px;
margin: 0 auto;
background: url(../img/ar03.png) center center no-repeat;
}

/* バツ */
.wrapbatu {
width: 48px;
height: 224px;
margin: 0 auto;
background: url(../img/img_batu.png) center center no-repeat;
}

/* 吹き出し背景 */
.wrap2 .fu {
width: 100%;
font-size: 20px;
font-weight: 400;
position: absolute;
top: 50%;left: 50%;-webkit-transform: translate(-50%, -50%);transform: translate(-50%, -50%);
z-index: 0;
}


/* 隙間 */
.wrap_spr1 {
margin-right: 1%;
}
.wrap_spr2 {
margin-right: 2%;
}
.wrap_spr3 {
margin-right: 3%;
}
.wrap_spr3_2 {
margin-right: 3%;
}
.wrap_spl3 {
margin-left: 3%;
}
.wrap_spb3 {
margin-bottom: 3%;
}
.wrap_pad2 {
padding: 2%;
}
.wrap_pad3 {
padding: 3%;
}

.wrap_center {
text-align: center;
}

@media only screen and (max-width: 767px) {
.wrapbox {
-webkit-flex-direction: column;
flex-direction: column;
}
.wrapbox2 {
-webkit-flex-direction: column;
flex-direction: column;
-webkit-flex-direction: column-reverse;
flex-direction: column-reverse;
}
.wrapbox3 {
-webkit-flex-direction: column;
flex-direction: column;
}
.wrapbox4 {
-webkit-flex-direction: column;
flex-direction: column;
-webkit-flex-direction: column-reverse;
flex-direction: column-reverse;
}
.wrapbox6 {
-webkit-flex-direction: column;
flex-direction: column;
}
.wrapbox9 {
width: 100%;
-webkit-flex-direction: column;
flex-direction: column;
}

.wrap1,
.wrap2,
.wrap3,
.wrap3_2,
.wrap4,
.wrap5,
.wrap6,
.wrap6_2,
.wrap7,
.wrap8 {
width: 100%;
margin: 0 auto;
text-align: center;
}

/* 隙間 */
.wrap_spr1 {
margin: 0 0 3% 0;
}
.wrap_spr3 {
margin: 0 0 3% 0;
}
.wrap_spl3 {
margin: 0 0 3% 0;
}


/* 矢印 */
.wrapar1 {
width: 64px;
height: 64px;
margin: 20px auto;
background: url(../img/ar04.png) center center no-repeat;
}
/* バツ */
.wrapbatu {
width: 48px;
height: 100px;
margin: 0 auto;
background: url(../img/img_batu.png) center center no-repeat;
}
}


/* 画像+テキストレイアウト
*************/
/* 見出し */
.mi {
margin: 5px 0 5px 0;
font-size: 16px;
line-height: 1.3em;
font-weight: bold;
text-align: left;
}
.mi::after {
content: '';
display: block;
height: 1px;
width: 30px;
margin: 5px 0 0;
background: #1a4176;
}

.mi2 {
margin: 0 0 20px 0;
font-size: 25px;
line-height: 1.3em;
font-weight: bold;
text-align: left;
}
.mi2::after {
content: '';
display: block;
height: 2px;
width: 10%;
margin: 10px 0 0;
background: #666;
}
@media only screen and (max-width: 767px) {
.mi2 {
margin: 20px 0 20px 0;
text-align: center;
}
.mi2::after {
margin: 10px auto 0 auto;
}
}

.mi3 {
margin: 10px auto 0px auto;
color: #e60012;
font-size: 15px;
text-align: center;
}

/*  */
.block1_1 {
margin: 0 auto 20px auto;
display: -webkit-flex;
display: flex;
-webkit-justify-content: space-between;
justify-content: space-between;
}
.block1_tag {
    display: -webkit-flex;
    display: flex;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-align-items: center;
    align-items: center;
}
.block1_2 {
width: 100%;
display: -webkit-flex;
display: flex;
-webkit-justify-content: center;
justify-content: center;
-webkit-justify-content: space-between;
justify-content: space-between;
-webkit-align-items: flex-start;
align-items: flex-start;
}

@media only screen and (max-width: 767px) {
.block1_1 {
-webkit-flex-direction: column;
flex-direction: column;
text-align: center;
}
.block1_2 {
-webkit-flex-direction: column;
flex-direction: column;
}
}

.block1_3 {
margin: 20px auto 0 auto;
display: -webkit-flex;
display: flex;
-webkit-justify-content: flex-end;
justify-content: flex-end;
-webkit-align-items: flex-end;
align-items: flex-end;
}
.block1_3 li.b1_3l {
margin: 0 20px 0 0;
font-size: 16px;
}
.block1_3 li.b1_3r {
font-size: 30px;
font-weight: 700;
}



/* ロールオーバー黒 */
.ImgBox {
background: #000;
overflow: hidden;
}
.ImgBox-Img {
 transition-duration: 0.3s
}
.ImgBox-Img:hover {
transform: scale(1.2);
transition-duration: 0.3s;
opacity: 0.6;
	
}


/* news-アーカイブ */
#contents .wrap_archives {
position: relative;
padding: 30px 3% 0 3%;
margin: 0 0 8% 0;
border: 5px solid #f1f1f1;
}
#contents .wrap_archives .archives {
position: absolute;
top: -20px;
left: 50%;
transform: translateY(0%) translateX(-50%);
-webkit- transform: translateY(0) translateX(-50%);
padding: 5px 30px;
color: #fff;
font-size: 14px;
font-weight: bold;
text-align: center;
background: #000;
}
#contents .in_archives {
width: 103%;
overflow: hidden;
}
#contents .wrap_archives .menucol4 {
margin: 0 3% 2% 0;
width: 22%;
text-align: left;
float: left;
}
@media screen and (max-width: 767px) {
#contents .wrap_archives {
position: relative;
padding: 5% 3% 0 3%;
}
#contents .in_archives {
width: 100%;
}
#contents .wrap_archives .menucol4 {
width: 100%;
}
}



/* 画像
*************/
/* 画像丸 */
.imgradius img {
border-radius: 50%;
-webkit-border-radius: 50%;
-moz-border-radius: 50%;
}


/* 引用デザイン */
.blockquote {
width: 80%;
position: relative;
padding: 15px 20px 20px 70px;
margin: 0 auto;
background:url(../img/ico_quotation.png) 20px 20px no-repeat , #e2f2ff;
border: solid 5px #0f1565;
}
.blockquote:before{
position: absolute;
width: 30px;
height: 24px;
top: 0px;
left: 0px;}
.blockquote p {
padding: 0;
margin: 10px 0;
line-height: 1.7;
}
.blockquote cite {
display: block;
text-align: right;
color: #888888;
font-size: 0.9em;
}

@media only screen and (max-width: 767px){
.blockquote {
width: 100%;
}
}

/* 下からふわっと表示 */
.fadein {
opacity : 0;
transform: translateY(50px);
transition: all 1.5s;
}

/* 画像に影 */
.imgshadow img {
box-shadow: 6px 6px #eee9de;
}

/* contact */
.block_contact {
display: -webkit-flex;
display: flex;
align-items: center;
}
.block_contact li.bcsp {
margin: 0 20px 0 10px;
}


/* スマホ用メニュー非表示
------------------------------------------------------------*/
@media only screen and (min-width: 767px){
.side-menu-btn {
display: none !important
}
.side-menu {
display: none !important
}
}

/* グローバルメニュー非表示
------------------------------------------------------------*/
@media only screen and (max-width: 767px){
nav#HdrNavi {
display: none !important
}
nav#footnav  {
display: none !important
}
}


/* PC用
------------------------------------------------------------*/
@media only screen and (min-width: 767px){
html {
min-width: 1200px; /* 右端が切れる時調整 */
}


*, *:before, *:after {
-webkit-box-sizing: border-box!important;
-moz-box-sizing: border-box!important;
-o-box-sizing: border-box!important;
-ms-box-sizing: border-box!important;
box-sizing: border-box!important;
}


/* PC用コンテンツ
------------------------------------------------------------*/

/*col
*************/
/* contents */
#contents .col2 {
width: 505px;
margin-right: 40px;

}
#contents .col3 {
width: 336px;
margin-right: 21px;
   
}
#contents .col4 {
width: 246px;
margin-right: 21px;
;    
}
#contents .col5 {
width: 194px;
margin-right: 20px;
   
}
#contents .col6 {
width: 158.3px;
margin-right: 20px;
   
}

  
    
    
.alignleft,
.alignright {
max-width:100%;
height: auto;
text-align: center;
display: block;
}
}

@media all and (-ms-high-contrast: none) {
.contents2 ul{

    }    
    
#contents .col2 {
width: 505px;
margin-right: 40px;
vertical-align: top;
display: inline-block;
float: none !important
}
#contents .col3 {
width: 336px;
margin-right: 21px;
vertical-align: top;
display: inline-block;  
float: none !important    
}
#contents .col4 {
width: 246px;
margin-right: 21px;
vertical-align: top;
display: inline-block; 
float: none !important    
}
#contents .col5 {
width: 194px;
margin-right: 18px;
vertical-align: top;
display: inline-block; 
float: none !important    
}
#contents .col6 {
width: 158.3px;
margin-right: 15px;
vertical-align: top;
display: inline-block; 
float: none !important
}
}  


/* 767以下
------------------------------------------------------------*/
@media only screen and (max-width: 767px){
html {
overflow-x: hidden;
}

*, *:before, *:after {
-webkit-box-sizing: border-box!important;
-moz-box-sizing: border-box!important;
-o-box-sizing: border-box!important;
-ms-box-sizing: border-box!important;
box-sizing: border-box!important;
}


/* 全体
*************/
.alignleft,
.alignright {
max-width: 600px;
margin:0 auto 20px auto;
clear: both;
float: none;
text-align: center;
display: block;
}

/*contents
*************/
#contents .col1,
#contents .col2,
#contents .col3 {
width: 98%;
margin-right: auto;
margin-left: auto;
text-align: center;
clear: both;
float: none;
}
#contents .col4 {
width: 47%;
margin: 0 1.5% 40px 1.5%; 
text-align: center;
}    
#contents .col5 {
width: 47%;
margin: 0 1.5% 40px 1.5%; 
text-align: center;
}
#contents .col6 {
width: 47%;
margin: 0 3% 40px 3%;     
}

.w6l,
.w4r,
.w4l,
.w6r,
.w3l,
.w3r,
.w7l,
.w7r {
width: 98%;
margin-right: auto;
margin-left: auto;
clear: both;
float: none;
}

/* scroll
*************/
.scroll{
width: 100%;
overflow: auto;
}
.scroll table.table2 {
width: 100%;
/*white-space: nowrap;*/
}
.scroll table.table2 tbody{
width: 100%;
}
.scroll::-webkit-scrollbar{
height: 5px;
}
.scroll::-webkit-scrollbar-track{
background: #F1F1F1;
}
.scroll::-webkit-scrollbar-thumb{
background: #BCBCBC;
}
.scroll table.table2 {
width:850px;
}


.scroll table.table4 {
width: 100%;
white-space: nowrap;
}
.scroll table.table4 tbody{
width: 100%;
}
.scroll::-webkit-scrollbar{
height: 5px;
}
.scroll::-webkit-scrollbar-track{
background: #F1F1F1;
}
.scroll::-webkit-scrollbar-thumb{
background: #BCBCBC;
}
.scroll table.table4 {
width:1050px;
}

}


/* パソコンで見たときは"pc"のclassがついた画像が表示される */
.pc { display: block !important; }
.sp { display: none !important; }

/* スマートフォンで見たときは"sp"のclassがついた画像が表示される */
@media only screen and (max-width: 767px) {
.pc { display: none !important; }
.sp { display: block !important; }
}


/*area edit*/

.wcarea_40020B818301 .col2 {
	width: 505px !important;
	display: inline-block !important;
	vertical-align: top !important;
}
.wcarea_40020B818301 .col3 {
	width: 330px !important;
	display: inline-block !important;
	vertical-align: top !important;
}
.wcarea_40020B818301 .col4 {
	width: 246px !important;
	display: inline-block !important;
	vertical-align: top !important;
}
.wcarea_40020B818301 .col5 {
	width: 180px !important;
	display: inline-block !important;
	vertical-align: top !important;
}

.wcarea_40020B818301 .col6 {
	width: 158px !important;
	display: inline-block !important;
	vertical-align: top !important;
}

.wcedit_40020B818301 #photo_container::before {
	display: block　!important;
	content: "スライドショー部分です";
	width: 100%;
}

.wcedit_40020B818301 #thumbnail li{
	width: 250px !important;
	vertical-align: top !important;
	display: inline-block;
}

@media screen and (max-width:767px) {
	.button01,
	.button01 a {
		font-size: 13px !important;
	}
	.button01::after {
  top: 55%;
  width: 5px;
  height: 5px;
  border-top: 1px solid #fff;
  border-right: 1px solid #fff;
}
	
	
}

.wcedit_40020B818301 .col5 {
    display: inline-block !important;
    vertical-align: top !important;
    float: none !important;
    width: 194px;
margin-right: 10px !important;
}

/* header
*************/
#header {
	position: fixed;
	width: 100%;
	background: #fff;
	box-shadow: 0 2px 10px rgba(0,0,0,0.1);
	z-index: 999;
  }
  
  .top-bar {
	background: #080385;
	padding: 5px 0;
	text-align: right;
  }
  
  .contact-info {
	width: 1220px;
	margin: 0 auto;
	padding: 0 20px;
	color: #fff;
  }
  
  .contact-info .tel1 {
	font-size: 14px;
	margin-right: 5px;
  }
  
  .contact-info .tel2 {
	font-size: 18px;
	font-weight: bold;
	margin-right: 15px;
  }
  
  .contact-info .time {
	font-size: 12px;
  }
  
  .main-header {
	width: 1220px;
	margin: 0 auto;
	padding: 20px;
	text-align: center;
  }
  
  .logo {
	margin: 0 auto 20px;
	transition: all 0.3s ease;
  }
  
  .logo:hover {
	transform: scale(1.05);
  }
  
  /* HdrNavi */
  nav#HdrNavi {
	width: 100%;
	margin: 0 auto;
  }
  
  nav#HdrNavi ul {
	display: flex;
	justify-content: center;
	gap: 40px;
  }
  
  nav#HdrNavi ul li {
	position: relative;
  }
  
  nav#HdrNavi ul li a {
	color: #080385;
	font-size: 16px;
	font-weight: 500;
	padding: 5px 0;
	position: relative;
  }
  
  nav#HdrNavi ul li a::after {
	content: '';
	position: absolute;
	bottom: -2px;
	left: 0;
	width: 0;
	height: 2px;
	background: #fed046;
	transition: width 0.3s ease;
  }
  
  nav#HdrNavi ul li a:hover::after {
	width: 100%;
  }
  
  /* SubMenu */
  nav#HdrNavi .SubMenu {
	position: absolute;
	top: 100%;
	left: 50%;
	transform: translateX(-50%);
	background: #fff;
	padding: 10px 0;
	border-radius: 4px;
	box-shadow: 0 2px 10px rgba(0,0,0,0.1);
	opacity: 0;
	visibility: hidden;
	transition: all 0.3s ease;
  }
  
  nav#HdrNavi li:hover .SubMenu {
	opacity: 1;
	visibility: visible;
  }
  
  nav#HdrNavi .SubMenu li {
	white-space: nowrap;
	padding: 5px 20px;
  }
  
  nav#HdrNavi .SubMenu li a {
	color: #333;
	font-size: 14px;
  }
  
  /* Responsive */
  @media only screen and (max-width: 1200px) {
	.contact-info,
	.main-header {
	  width: 100%;
	}
  }
  
  @media only screen and (max-width: 767px) {
	.top-bar {
	  display: none;
	}
	
	.main-header {
	  padding: 10px;
	}
	
	.logo {
	  margin: 0 auto 10px;
	}
	
	nav#HdrNavi ul {
	  flex-direction: column;
	  gap: 10px;
	}
	
	nav#HdrNavi .SubMenu {
	  position: static;
	  transform: none;
	  box-shadow: none;
	  padding: 0;
	}
  }

  
.brand-nav {
	position: fixed;
    left: 0px;
    top: 40%;
    z-index: 2000;
}