@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 {
overflow-x: hidden;
-ms-text-size-adjust: 100%;
-webkit-text-size-adjust: 100%;
}
body {
position: relative;
color:#4d014c;
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;
}


/* リンク設定
------------------------------------------------------------*/
a{color:#4d014c;text-decoration:underline;}
a:hover{color:#4d014c;text-decoration: underline;}
a:active, a:focus {outline:0;}



/* 全体
------------------------------------------------------------*/
.inner {
width:100%;
margin:0 auto;
clear: both;
}
@media only screen and (min-width: 1210px){
.inner {
width: 1210px;
}
}
@media only screen and (max-width: 1209px){
.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: 1210px){
#contents {
padding: 0px 0 0 0;
}
#contents .contents {
width: 1210px;
}
#contents .inner {
width: 1210px;
}
}
@media only screen and (max-width: 1210px){
#contents {
padding: 0px 0 0 0;
}
#contents .contents {
width: 100%;
}
#contents .inner {
width: 94%;
}
}
@media only screen and (max-width: 1210px){
#contents {
padding: 0px 0 0 0;
}
}



/* 画像自動縮小
*************/
#header img,
#footer img,
#top img,
#top1 img,
#top2 img,
#top3 img,
#top4 img,
#topbn img,
.page-visual-ttl img,
#title img,
#bn_contact img,
#contact2 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,
.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: #d62326;
}
.fontpink{
color: #e5006e;
}
.fontblue {
color: #1f9cbb;
}
.fontorange {
color: #f6ac2a;
}
.fontgreen {
color: #51cc91;
}

.strong {
font-weight: bold;
}

.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: 'YuGothB';
}
.family4 {
font-family: 'A1MinchoStd-Bold';
}

@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 20px 0px;
}
.aligncenter{
display: block;
margin-left: auto;
margin-right: auto;
padding: 0px 0px 10px 0px;
}
.alignright{
float:right;
clear:right;
margin:0px 0 20px 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;}
.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 10% 0;
line-height: 1.8em;
text-align: left;
clear: both;
}
section.content2 {
width: 103%;
padding: 0 0 0 0;
margin: 0 0 10% 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 10% 0;
clear: both;
}
section.content5 {
width: 100%;
padding: 0 0 0 0;
margin: -7% 0 0 0;
line-height: 1.8em;
text-align: center;
clear: both;
}
section.content6 {
width: 100%;
padding: 0 0 0 0;
margin: -8% 0 8% 0;
text-align: center;
clear: both;
}
section.content7 {
width: 100%;
padding: 0 0 0 0;
margin: 0 0 5% 0;
line-height: 1.8em;
overflow: hidden;
text-align: left;
clear: both;
}
section.content8 {
width: 100%;
padding: 0 0 0 0;
margin: 0 0 10% 0;
clear: both;
}



@media only screen and (min-width: 1210px){
section.content {
width: 1050px;
margin: 0 auto 100px auto;
}
section.content2 {
width: 1090px;
margin: 0 0 100px 0;
}
section.content3 {
width: 1050px;
}
section.content4 {
width: 1090px;
}
section.content5 {
width: 1050px;
margin: -50px 0 50px 0;
}
section.content7 {
width: 1050px;
margin: 0 0 50px 0;
}
section.content8 {
width: 1050px;
margin: 0 0 100px 0;
}

}
@media only screen and (max-width: 1210px){
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
*************/
#header {
position: fixed;
width: 100%;
padding: 20px 0;
letter-spacing: 0;
margin: 0 auto;
color: #fff;
z-index: 999;
}
#header .inner {
width: 100%;
margin: 0 auto;
}
#header ul.hm {
width: 100%;
margin: 0 auto 0 0;
display: -webkit-flex;
display: flex;
-webkit-justify-content: space-between;
justify-content: space-between;
align-items: center;
}
#header ul.hm li {
padding: 0 10px 0 0;
}
#header ul.hm li:last-child {
padding: 0 0 0 0;
}

@media only screen and (min-width: 1210px){
#header .inner {
width: 1210px;
}
#header ul.hm {
width: 1210px;
}
}
@media only screen and (max-width: 1209px){
#header {
padding: 15px 0;
}
#header .inner {
width: 94%;
}
#header ul.hm {
width: 90%;
}
#header ul.hm li {
margin-right: 2%;
}
}
@media only screen and (max-width: 460px){
#header ul.hm {
width: 84%;
}
#header ul.hm {
-webkit-flex-wrap: wrap;
flex-wrap: wrap;
}
#header ul.hm li::after {
content: "";
display: block;
width: 48%;
height: 0;
}
#header ul.hm li {
width: 48%;
margin: 0 0 10px 0;
}
#header ul.hm li::after,
#header ul.hm li::before {
content: "";
display: block;
width: 48%;
height: 0;
}
#header ul.hm li::before {
order: 1;
}
#header ul.hm li:last-child {
padding: 0 10px 0 0;
}
}

/* 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 {
}
@media only screen and (min-width: 767px){
}
@media only screen and (max-width: 767px){
}


/* footer
*************/
#footer {
position: relative;
width: 100%;
padding: 70px 0;
letter-spacing: 0;
background: url(images/bg_footer.png) top center no-repeat , #be97bd;
z-index: 0;
}
#footer .inner {
position: relative;
margin: 0 auto;
}
#footer ul.wrapft {
width: 448px;
margin: 0 0 0 auto;
text-align: left;
}
#footer .flogo {
margin: 0 0 40px 0;
}
#footer .fadd {
font-size: 22px;
line-height: 1.7em;
}

@media only screen and (min-width: 1210px){
}
@media only screen and (max-width: 767px){
#footer {
padding: 30px 0;
}
#footer ul.wrapft {
width: 100%;
text-align: center;
}
#footer .flogo {
margin: 0 0 20px 0;
}
#footer .flogo img {
max-width: 300px;
height: auto;
}
#footer .fadd {
font-size: 18px;
}
}

/* 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:#ccc; text-decoration: none;}



/* footnav
*************/
nav#footnav {
position: relative;
width: 100%;
padding: 20px 0;
background: #b94046;
clear: both;
}
nav#footnav .inner {
margin: 0 auto;
}
nav#footnav ul {
display: flex;
/*justify-content: space-between;*/
font-size: 16px;
font-weight: 400;
line-height: 1em;
}
nav#footnav li {
flex-grow: 1;
text-align: center;
border-left: 1px solid #fff;
border-right: 1px solid #fff;
}
nav#footnav ul li + li {
border-left: none;
border-right: 1px solid #fff;
}


@media only screen and (min-width: 1210px){
nav#footnav .inner {
width: 790px;
}
}

/* 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:#f3bec0; text-decoration: none;}

/* copyright */
.copyright {
padding: 10px 0;
color: #fff;
font-size: 13px;
letter-spacing:1px;
background: #4d014c;
}
@media only screen and (max-width: 1210px){
.copyright {
font-size: 12px;
}
}


/* 固定ボタン
*************/
.headerGlobalBtn > li > a{
background-repeat: no-repeat;
background-position: 0 0;
display: block;
width: 93px;
height: 275px;
margin: 0;
padding: 0;
text-indent: 100%;
white-space: nowrap;
overflow: hidden;
z-index: 9999;
}
.headerGlobalBtn{
width: auto;
position: fixed;
top: 30%;
left: 0;
z-index: 999;
}
.headerGlobalBtn > li{
display: block;
margin: 0 0 0px 0;
padding: 0;
}
.headerGlobalBtn > .headerGbtn1 > a {
width: 93px;
height: 275px;
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(images/bn_side1.png);
}
.headerGlobalBtn > .headerGbtn1 > a:hover {
opacity: 0.6;
}
@media only screen and (max-width:767px) {
.headerGlobalBtn{
top: 50%;
}
.headerGlobalBtn > .headerGbtn1 > a {
width: 60px;
height: 177px;
background-image: url(images/bn_side1sp.png);
}
}


/* main
------------------------------------------------------------*/
/* top
*************/
#top {
position: relative;
width: 100%;
height: auto;
z-index: 0;
clear: both;
}
#top .inner {
width: 100%;
}

@media only screen and (min-width: 1210px){
#top {
padding: 0 0 0 0;
}
#top .inner {
width: 1210px;
}
}
@media only screen and (max-width: 1209px){
#top {
padding: 0px 0 0 0;
}
#top .inner {
width: 94%;
}
}


/* popup */
.popup {
position: fixed;
left: 0;
top: 0;
width: 100%;
height: 100%;
z-index: 9999;
opacity: 0;
visibility: hidden;
transition: .6s;
}
.popup.is-show {
opacity: 1;
visibility: visible;
}
.popup-inner {
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%,-50%);
width: 80%;
max-width: 600px;
padding: 40px;
background-color: #fff;
z-index: 2;
}
.popup-inner img {
width: 100%;
}
.close-btn {
position: absolute;
right: 0;
top: 0;
width: 50px;
height: 50px;
line-height: 50px;
text-align: center;
cursor: pointer;
}
.close-btn i {
font-size: 20px;
color: #333;
}
.black-background {
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
background-color: rgba(0,0,0,.8);
z-index: 1;
cursor: pointer;
}
.popup .popttl {
margin: 0 0 20px 0;
font-size: 26px;
font-weight: 400;
text-align: center;
font-family: 'Leisyo-G';
}

@media only screen and (max-width: 767px){
.popup-inner {
padding: 20px;
}
}

/* top1 */
#top1 {
position: relative;
width: 100%;
padding: 0 0 70px 0;
margin: 0 auto;
background: url(images/bg_con01l.png) left top no-repeat , url(images/bg_con01r.png) right top no-repeat;
}
#top1 ul.wrapt1 {
padding: 100px 0 0 0;
margin: 0 auto 100px auto;
display: -webkit-flex;
display: flex;
-webkit-justify-content: space-between;
justify-content: space-between;
align-items: flex-start;
}
#top1 ul.wrapt1 li.t1 {
padding: 0px 20px 0 0;
}
#top1 ul.wrapt1 li.t2 {
padding: 100px 0 0 0;
text-align: left;
}
#top1 ul.wrapt1 li.t3 {
padding: 0 0 0 20px;
}
#top1 p.t1txt1 {
margin: 0 0 50px 0;
}
#top1 p.t1txt2 {
margin: 0 0 80px 0;
}

@media only screen and (min-width: 1210px){

}

@media only screen and (max-width: 1210px){
#top1 ul.wrapt1 {
padding: 100px 0 0 0;
}
#top1 ul.wrapt1 li.t1 {
padding: 0px 20px 0 0;
}
#top1 ul.wrapt1 li.t2 {
padding: 0px 0 0 0;
}
#top1 ul.wrapt1 li.t3 {
width: 50%;
padding: 0px 0 0 20px;
}
#top1 p.t1txt1 {
margin: 0 0 20px 0;
}
#top1 p.t1txt2 {
margin: 0 0 20px 0;
}
}
@media only screen and (max-width: 460px){
#top1 ul.wrapt1 {
padding: 200px 0 0 0;
}
#top1 ul.wrapt1 li.t1 {
padding: 0px 20px 0 0;
}
#top1 ul.wrapt1 {
margin: 0 auto 70px auto;
}
}

/* news */
#news {
margin: 0 auto;
}
#news ul.wrapnews {
display: -webkit-flex;
display: flex;
-webkit-justify-content: space-between;
justify-content: space-between;
align-items: center;
}
#news ul.wrapnews li.newsl {
width: 15%;
min-height: 140px;
padding: 45px 20px 20px 20px;
background: #4d014c;
}
#news ul.wrapnews li.newsr {
width: 85%;
min-height: 140px;
padding: 30px;
background: #fff;
}
#news .news {
width: 100%;
height: 80px;
margin: 0 auto;
overflow: auto;
}
#news dl {
width: 100%;
padding: 0;
margin: 10px 0 10px 0;
display: -webkit-flex;
display: flex;
}
#news dl dt {
width: 15%;
font-size: 14px;
text-align: left;
}
#news dl dd {
width: 85%;
text-align: left;
}

@media only screen and (min-width: 1210px){
#news {
width: 1060px;
}
}
@media only screen and (max-width: 1210px){
#news {
width: 100%;
}
#news .news {
width: 100%;
padding: 0;
}
#news dl dt {
width: 30%;
}
#news dl dd {
width: 70%;
}
}
@media only screen and (max-width: 460px){
#news {
width: 100%;
}
#news .news {
width: 100%;
height: auto;
padding: 0;
}
#news ul.wrapnews {
-webkit-flex-direction: column;
flex-direction: column;
}
#news ul.wrapnews li.newsl {
width: 100%;
min-height: 70px;
padding: 15px 0 0 0;
}
#news ul.wrapnews li.newsr {
width: 100%;
padding: 20px;
}
#news dl {
width: 100%;
margin: 20px 0 20px 0;
-webkit-flex-direction: column;
flex-direction: column;
}
#news dl dt {
width: 100%;
}
#news dl dd {
width: 100%;
}
}


/* top2 */
#top2 {
position: relative;
width: 100%;
padding: 110px 0 90px 0;
margin: 0 auto;
background: #f7e8f7;
}
#top2 ul.wrapt2 {
display: -webkit-flex;
display: flex;
-webkit-justify-content: space-between;
justify-content: space-between;
flex-wrap : wrap;
}
#top2 ul.wrapt2 li {
width:23%;
position: relative;
padding: 20px 15px 40px 15px;
background: #fff;
}
#top2 ul.wrapt2 li::before{
content:"";
display: block;
width:23%;
order:1;
}
#top2 ul.wrapt2 li::after{
content:"";
display: block;
width:23%;
}
#top2 ul.wrapt2 li h3.t2 {
position: absolute;
padding: 20px 20px;
min-height: 220px;
color: #fff;
font-size: 18px;
background: #4d014c;
font-family: 'Leisyo-G';
-webkit-writing-mode: vertical-rl;
-ms-writing-mode: tb-rl;
-o-writing-mode: vertical-rl;
writing-mode: vertical-rl;
right: 0;
top: 0;
z-index: 2;
}
#top2 ul.wrapt2 .t2pho img {
border-radius: 50%;
-webkit-border-radius: 50%;
-moz-border-radius: 50%;
}
#top2 ul.wrapt2 p.t2txt {
margin: 20px 0 0 0;
text-align: left;
}
#top2 ul.wrapt2 .bn_more {
width: 100%;
position: absolute;
top: 100%;left: 50%;
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
z-index: 2;
}

@media only screen and (min-width: 1210px){

}
@media only screen and (max-width: 1210px){
#top2 {
padding: 70px 0 70px 0;
}
#top2 ul.wrapt2 li {
width:45%;
margin: 0 0 70px 0;
}
#top2 ul.wrapt2 li::before{
width:45%;
}
#top2 ul.wrapt2 li::after{
width:45%;
}
}
@media only screen and (max-width: 460px){
#top2 ul.wrapt2 li {
width: 100%;
margin: 0 0 70px 0;
}
#top2 ul.wrapt2 li::before{
width: 100%;
}
#top2 ul.wrapt2 li::after{
width: 100%;
}
#top2 ul.wrapt2 li h3.t2 {
right: 20px;
}
}

/* top3 */
#top3 {
position: relative;
width: 100%;
padding: 70px 0 70px 0;
margin: 0 auto;
background: #fff;
}
#top3 h3.t3 {
margin: 0 0 30px 0;
display: flex;
align-items: center;
font-size: 25px;
font-family: 'YuMin-B';
}
#top3 h3.t3:after {
border-top: 4px solid #c2a8c2;
content: "";
flex-grow: 1;
}
#top3 h3.t3:after {
margin-left: 2rem;
}
#top3 h4.t3 {
padding: 0 0 10px 23px;
font-size: 28px;
font-family: 'Leisyo-G';
text-align: left;
}

#top3 ul.wrapt3 {
display: -webkit-flex;
display: flex;
-webkit-justify-content: space-between;
justify-content: space-between;
flex-wrap : wrap;
}
#top3 ul.wrapt3 li {
position: relative;
width:43%;
margin: 0 0 60px 0;
display: flex;
flex-direction: column;
}
#top3 ul.wrapt3 li::before{
content:"";
display: block;
width:43%;
order:1;
}
#top3 ul.wrapt3 li::after{
content:"";
display: block;
width:43%;
}
#top3 ul.wrapt3 .t3pho {
padding: 0 0 20px 23px;
text-align: left;
}
#top3 ul.wrapt3 p.t3txt {
padding: 0 0 40px 23px;
text-align: left;
}
#top3 ul.wrapt3 .bn_more {
margin-top: auto;
text-align: right;
}

@media only screen and (max-width: 460px){
#top3 ul.wrapt3 li {
width: 100%;
margin: 0 0 70px 0;
}
#top3 ul.wrapt3 li::before{
width: 100%;
}
#top3 ul.wrapt3 li::after{
width: 100%;
}
#top3 ul.wrapt3 .bn_more {
text-align: center;
}
}



/* top4 */
#top4 {
position: relative;
width: 100%;
padding: 80px 0;
margin: 0 auto;
background: #f7e8f7;
}
#top4 ul.wrapt4 {
display: -webkit-flex;
display: flex;
-webkit-justify-content: space-between;
justify-content: space-between;
}
#top4 ul.wrapt4 li.t4l {
position: relative;
width: 20%;
margin: 0 20px 0 0;
text-align: left;
}
#top4 ul.wrapt4 li.t4r {
position: relative;
width: 80%;
padding: 40px 40px 30px 40px;
background: url(images/bg_top4.jpg) left top no-repeat , #fff;
border: 1px solid #fff;
}
#top4 ul.wrapt4in {
display: -webkit-flex;
display: flex;
-webkit-justify-content: space-between;
justify-content: space-between;
}
#top4 h3.t4 {
padding: 20px;
color: #fff;
font-size: 62px;
line-height: 1em;
font-family: 'Leisyo-G';
background: #4d014c;
}
#top4 .eve {
width: 70%;
text-align: left;
}
#top4 .eve dl {
width: 100%;
padding: 0 0 20px 0;
margin: 0 0 20px 0;
background: url(images/line01.png) left bottom repeat-x;
}
#top4 .eve dl dt {
font-size: 20px;
}
#top4 .eve dl dd {
font-size: 30px;
font-weight: 400;
}
#top4 ul.wrapt4 li.t4l .bn_more {
position: absolute;
left: 0;
bottom: 0;
}

@media only screen and (min-width: 1210px){

}
@media only screen and (max-width: 1210px){
#top4 ul.wrapt4 li.t4l .ttl img {
max-width: 100px;
height: auto;
}
#top4 ul.wrapt4 li.t4l .bn_more {
position: relative;
margin: 20px 0 0 0;
}
}
@media only screen and (max-width: 767px){
#top4 ul.wrapt4 {
-webkit-flex-direction: column;
flex-direction: column;
}
#top4 ul.wrapt4 li.t4l {
width: 100%;
margin: 0 auto 40px auto;
text-align: center;
}
#top4 ul.wrapt4 li.t4r {
width: 100%;
padding: 20px 20px 20px 20px;
}
#top4 h3.t4 {
padding: 20px;
font-size: 5vw;
}
#top4 .eve dl dt {
font-size: 18px;
}
#top4 .eve dl dd {
font-size: 20px;
}
#top4 .eve dl {
padding: 0 0 10px 0;
margin: 0 0 10px 0;
}
}




/* footercon */
#footercon {
position: relative;
width: 100%;
padding: 50px 0;
margin: 0 auto;
background: #fff;
}
#footercon ul.wrapfc {
display: -webkit-flex;
display: flex;
-webkit-justify-content: space-between;
justify-content: space-between;
}
#footercon ul.wrapfc li.fcl {
width: 30%;
text-align: left;
}
#footercon ul.wrapfc li.fcr {
width: 70%;
text-align: left;
}
#footercon h3.fc {
margin: 0 0 40px 0;
}
#footercon p.fctxt {
margin: 0 0 50px 0;
font-size: 25px;
line-height: 1.7em;
}
#footercon ul.wrapfc .bn_more {
}


@media only screen and (min-width: 1210px){

}
@media only screen and (max-width: 1210px){
#footercon ul.wrapfc {
}
#footercon ul.wrapfc li.fcl .ttl img {
max-width: 100px;
height: auto;
}
#footercon h3.fc img {
max-width: 300px;
height: auto;
}
}
@media only screen and (max-width: 767px){
#footercon ul.wrapfc {
-webkit-flex-direction: column;
flex-direction: column;
}
#footercon ul.wrapfc li.fcl {
width: 100%;
margin: 0 auto 40px auto;
text-align: center;
}
#footercon ul.wrapfc li.fcl img {
max-width:100%;
height:auto;
}
#footercon ul.wrapfc li.fcr {
width: 100%;
text-align: center;
}
#footercon p.fctxt {
font-size: 18px;
line-height: 1.5em;
}
}

/* contact */
#contact {
position: relative;
width: 100%;
padding: 3% 0;
margin: 0 auto 100px auto;
background: url(../img/bg_contact.jpg) center center no-repeat;
background-size: cover;
text-align: center;
color: #fff;
border: 3px solid #000;
clear: both;
}
#contact .logo {
margin: 0 0 10px 0;
}
#contact .contxt1 {
margin: 0 0 20px 0;
font-size: 20px;
font-weight: 400;
}
#contact .contel1 {
padding: 0 0 0 5px;
color: #fff;
font-size: 20px;
font-weight: 400;
}
#contact .contel2 {
color: #fff;
font-size: 40px;
font-weight: 400;
}
#contact .contel2 a {
text-decoration: none;
}
#contact .add {
margin: 0 0 20px 0;
font-size: 16px;
font-weight: 400;
text-align: center;
}
#contact .bn_contact {
position: relative;
width: 50%;
margin: 0 auto 0 auto;
font-size: 16px;
line-height: 1.3em;
font-weight: bold;
}
#contact .bn_contact a {
padding: 20px 10px;
text-align: center;
text-decoration: none;
color: #fff;
background: #e70002;
-webkit-transition: all 0.4s ease;
-moz-transition: all 0.4s ease;
-o-transition: all 0.4s ease;
transition: all  0.4s ease;
box-sizing: border-box;
display: block;
}
#contact .bn_contact a:hover {
color: #e70002;
background: #fff;
-webkit-transition: all 0.4s ease;
-moz-transition: all 0.4s ease;
-o-transition: all 0.4s ease;
transition: all  0.4s ease;
}
@media only screen and (max-width: 767px){
#contact {
padding: 3%;
}
#contact .contxt1 {
margin: 0 0 10px 0;
font-size: 14px;
}
#contact .add {
font-size: 12px;
line-height: 1.3em;
}
#contact .bn_contact {
width: 100%;
font-size: 14px;
}
#contact .bn_contact a {
padding: 10px 10px;
}
}


/* 吹き出し */
.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: 20%;
}

@media only screen and (max-width: 1210px){
/* 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%;
}
}

/* table2
*************/
table.table2 {
border-collapse:collapse;
width:1050px;
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;
}

@media only screen and (max-width: 1210px){
table.table2 th {
padding: 10px;
}
table.table2 td {
padding: 10px;
}
}


/* table3
*************/
table.table3 {
border-collapse:collapse;
width:100%;
margin:0px auto 50px auto;
border-bottom:1px solid #4d014c;
clear: both;
}
table.table3 th {
padding: 20px;
border-top:1px solid #4d014c;
text-align: left;
font-weight: 400;
vertical-align: middle;
}
table.table3 td {
padding: 20px;
border-top:1px solid #4d014c;
vertical-align: middle;
}

@media only screen and (min-width: 1210px){
table.table3 th {
width: 30%;
}
}
@media only screen and (max-width: 1210px){
/* table
*************/
table.table3 {
width:100%;
}
table.table3 th {
width: 100%;
padding: 20px 0px 0px 0px;
display: block;
border: none;
}
table.table3 td {
width: 100%;
padding: 20px 0px 20px 0px;
display: block;
border: none;
}
}


/* table4
*************/
table.table4 {
width: 100%;
margin:0px auto 0px auto;
border-collapse: collapse;
border: solid 3px #1f9cbb;
}
table.table4 th, table.table4 td {
padding: 10px;
border: dashed 1px #1f9cbb;
}
table.table4 th {
border-bottom: solid 2px #1f9cbb;
background: #dff9ff;
}




/* form
*************/
.input {
width: 100%;
}
.input2 {
width: 45%;
margin-right: 10%;
}
.input3 {
width: 45%;
}
.input4 {
width: 60%;
}
.input5 {
width: 50%;
}
.hisu {
padding: 0 2% 0 2%;
margin: 0px 0px 0px 10px;
color: #ffffff;
font-size: 11px;
background: #e60012;
}
.submit {
width: 250px;
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: #f7f7f7;
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 {
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;
width: 50%;
border: 1px solid #bbbbbb;
border-radius: 3px;
background: #ffffff;
}
.selectlist.cp01::before {
position: absolute;
top: 1.5em;
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: 1em 38px 1em 1em;
color: #666666;
}

/* googlemap
*************/
.ggmap {
position: relative;
padding-bottom: 50%;
padding-top: 20px;
margin: 0;
height: 0;
overflow: hidden;
}
.ggmap iframe,
.ggmap object,
.ggmap embed {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}

.ggmap2 {
position: relative;
padding-bottom: 20%;
padding-top: 50px;
margin: 0;
height: 0;
overflow: hidden;
}
.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: 1210px) {
.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 0 70px 0;
clear: both;
}
.page-visual-ttl .page-visual {
position: absolute;
width: 100%;
padding: 1% 0 2% 0;
left: 0;
bottom: 0;
background: rgba(77,1,76,1);
z-index: 10;
}
.page-visual-ttl .page-visual::before {
content: "";
display: block;
position: absolute;
bottom: 0;
left: 50%;
width: 2px;
height: 20px;
margin-left: -1px;
background-color: #fff;
}
.page-visual-ttl .page-visual::after {
content: "";
display: block;
position: absolute;
bottom: -20px;
left: 50%;
width: 2px;
height: 20px;
margin-left: -1px;
background-color: #4d014c;
}
.page-visual-ttl .pho {
}
.page-visual-ttl .jp {
color: #fff;
font-size: 40px;
display: block;
font-family: 'Leisyo-G';
}
.page-visual-ttl .en {
color: #fff;
font-size: 13px;
display: block;
}


@media only screen and (max-width:767px){
.page-visual-ttl {
margin: 0 0 50px 0;
}
.page-visual-ttl .page-visual {
padding: 10px 0 30px 0;
}
.page-visual-ttl .jp {
font-size: 14px;
}
.page-visual-ttl .en {
font-size: 24px;
}
.page-visual-ttl .pho img {
height: 200px;
object-fit: cover;
}
}

/* 見出し
*************/
h3.commonTtl {
margin: 0 auto 40px auto;
}
h3.commonTtl .commonTtl-ja {
position: relative;
padding: 0 0 30px 0;
color: #740A00;
font-size: 30px;
text-align: center;
letter-spacing: 1px;
font-family: 'Leisyo-G';
display: inline-block;
}
h3.commonTtl .commonTtl-ja::before {
content: '';
position: absolute;
bottom: 10px;
display: inline-block;
width: 100px;
height: 1px;
left: 50%;
-webkit-transform: translateX(-50%);
transform: translateX(-50%);
background: #740A00;
}
h3.commonTtl .commonTtl-en {
padding: 0px 0 10px;
display: block;
position: relative;
line-height: 1.4;
color: #740A00;
font-size: 13px;
text-align: center;
letter-spacing: 1px;
}


@media only screen and (min-width: 1210px){
}

@media only screen and (max-width: 1210px){
}


/* カラム
*************/
#contents .col1 {
text-align: center;
}
#contents .col2 {
position: relative;
margin: 0 3% 5% 0;
float: left;
width: 47%;
text-align: left;
}
#contents .col3 {
position: relative;
margin: 0 3% 5% auto;
width: 30%;
float: left;
text-align: left;
}
#contents .col4 {
position: relative;
margin: 0 3% 5% 0;
width: 22%;
text-align: left;
float: left;
}
#contents .col5 {
margin: 0 3% 5% 0;
width: 17%;
text-align: left;
float: left;
}
#contents .col1 p,
#contents .col2 p,
#contents .col3 p,
#contents .col4 p,
#contents .col5 p {
padding: 1% 0 1% 0;
line-height: 1.5em;
}
#contents p {
text-align: left;
}
#contents p.center {
text-align: center;
}

/* ボタン下揃え */
#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 */
.box_line2 {
padding: 1em;
width: 100%;
border: 5px dotted #dcb2dc; /*太さ・線種・色*/
background-color: #fff; /* 背景色 */
border-radius: 1px; /*角の丸み*/
}

/* box_line3 */
.box_line3 {
padding: 2em;
background: #ffebe9;
border-top: solid 5px #e70002;
}



/* ボタン */
.buttonbox {
margin: 20px auto 0px auto;
text-align: center;
clear: both;
}
.buttonbox2 {
margin: 0px auto 100px auto;
text-align: center;
clear: both;
}
.buttonbox3 {
width: 80%;
margin: 40px auto 0px auto;
text-align: center;
clear: both;
}
.buttonbox4 {
width: 210px;
margin: 30px auto 0px auto;
text-align: center;
clear: both;
}
.buttonbox5 {
width: 400px;
margin: -50px auto 50px auto;
text-align: center;
clear: both;
}
.buttonbox_l {
width: 60%;
margin: 20px auto 0px 0;
text-align: center;
clear: both;
}
.buttonboxtop {
width: 100%;
position: absolute;
left: 0;
bottom: 0;
}

@media only screen and (min-width: 1210px) {
.buttonbox2 {
width: 50%;
}
}
@media only screen and (max-width: 1210px) {
.buttonbox {
width: 100%;
margin: 5% auto 0px auto;
}
.buttonbox2 {
width: 80%;
}
.buttonbox3 {
width: 100%;
margin: 5% auto 0 auto;
}
.buttonbox4 {
width: 80%;
}
.buttonbox5 {
width: 100%;
}
.buttonbox_l {
width: 100%;
}
.buttonboxtop {
position: relative;
width: 336px;
margin: 20px auto 0 auto;
}
}
@media only screen and (max-width: 1210px) {
.buttonboxtop {
width: 100%;
}
}

.buttonboxr {
margin: 20px auto 0px auto;
text-align: right;
clear: both;
}

/* button01 */
.button01 {
width: 100%;
margin: auto auto 5% auto;
}
.button01 a {
position: relative;
padding: 20px 10px;
text-align:center;
color: #fff;
font-size: 18px;
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: #e70002;
z-index: 100;
}
.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;
opacity: 0.7;
}
@media only screen and (max-width: 768px) {
.button01 a {
padding: 15px;
}
}

/* button02 */
.button02 {
width: 100%;
margin: auto auto 5% auto;
}
.button02 a {
position: relative;
padding: 15px 10px;
text-align:center;
color: #fff;
font-size: 18px;
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: #000;
z-index: 100;
}
.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: #fff;
background: #666;
}
@media only screen and (min-width: 1210px) {
}
@media only screen and (max-width: 1210px) {
.button02 a {
padding: 15px;
}
}


/* button03 */
.button03 {
position: relative;
display: inline-block;
width: 100%;
margin: auto auto 0 auto;
}
.button03 a {
padding: 15px 10px;
text-align:center;
color: #fff;
font-size: 17px;
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-color: #fe924c;
z-index: 100;
}
.button03::after {
position: absolute;
top: 50%;
right: .2em;
content: '';
margin-top: -5px;
border: 7px solid transparent;
border-top-width: 5px;
border-bottom-width: 5px;
border-left-color: #fff;
transition: all .3s;
}
.button03 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: #ff6130;
}
.button03:hover::after {
border-left-color: #fff;
}
@media only screen and (max-width: 1210px) {

}

/* button04 */
.button04 {
width: 100%;
margin: auto auto 5% auto;
}
.button04 a {
position: relative;
padding: 15px 10px;
text-align:center;
color: #000;
font-size: 18px;
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;
border-radius: 5px;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
background: url(../img/ico_pdf.png) 10% center no-repeat , #f4e53b;
z-index: 100;
}
.button04 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: url(../img/ico_pdf.png) 10% center no-repeat , #fff36e;
}
@media only screen and (max-width: 1210px) {
.button04 a {
padding: 40px 10px 10px 10px;
background: url(../img/ico_pdf.png) center 10px no-repeat , #f4e53b;
font-size: 14px;
}
.button04 a:hover {
background: url(../img/ico_pdf.png) center 10px no-repeat , #fff36e;
}
}


/* button05 */
.button05 {
width: 100%;
margin: 0 auto 0 auto;
}
.button05 a {
position: relative;
padding: 15px 10px;
text-align:center;
color: #fff;
font-size: 18px;
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: #1f9cbb;
border-radius: 5px;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
z-index: 100;
}
.button05 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: #52c1dc;
}
@media only screen and (max-width: 1210px) {
.button05 a {
padding: 15px;
}
}

/* 色ボタンレイアウト */
.menucol1 {
width: 20%;
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: 1210px){
.menucol1 {
width: 50%;
}
}
@media only screen and (max-width: 1210px){
.menucol1 {
width: 100%;
}
.menucol3 {
margin: 0 3% 1% 0;
width: 47%;
}
.menucol4 {
margin: 0 1.5% 3% 1.5%;
width: 47%;
}
}
@media only screen and (max-width: 767px){
.menucol3 {
margin: 0 3% 1% 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;
}
.wrapbox_no {
display: -webkit-flex;
display: flex;
}

.wrap1 {
width: 10%;
}
.wrap2 {
position: relative;
width: 20%;
}
.wrap3 {
width: 30%;
}
.wrap4 {
width: 40%;
}
.wrap5 {
width: 50%;
}
.wrap6 {
width: 60%;
}
.wrap7 {
width: 70%;
}
.wrap8 {
width: 80%;
}
.wrap9 {
width: 90%;
}

/* 線 */
.line1 {
padding: 10px 0 10px 0;
border-bottom: 3px solid #ccc;
}

/* 矢印 */
.wrapar1 {
background: url(../img/ar03.png) center 20% 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_spr3 {
margin-right: 3%;
}
.wrap_spr3_2 {
margin-right: 3%;
}
.wrap_spl3 {
margin-right: 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: 1210px) {
.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;
}


.wrap1,
.wrap2,
.wrap3,
.wrap4,
.wrap5,
.wrap6,
.wrap7,
.wrap8,
.wrap9 {
width: 100%;
margin: 0 auto;
text-align: center;
}
.wrapar1 {
height: 64px;
background: url(../img/ar04.png) center center no-repeat;
}

/* 隙間 */
.wrap_spr1 {
margin: 0 0 2% 0;
}
.wrap_spr3 {
margin: 0 0 3% 0;
}
.wrap_spl3 {
margin: 2% 0 0 0;
}
.wrap_spl3 {
margin: 3% 0 0 0;
}
}


/* 画像+テキストレイアウト
*************/
.wrap_bg1 {
padding: 40px;
margin-bottom: 100px;
background: #fff;
}



/* テキストレイアウト
*************/
h5.contactTtl {
margin: 0 0 20px 0;
font-size: 20px;
font-weight: 400;
}
.hissu {
padding: 2px 5px;
margin: 0 10px 0 0;
background: #ad2a0a;
color: #fff;
font-size: 14px;
line-height: 1em;
border-radius: 3px;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
}
.nini {
padding: 2px 5px;
margin: 0 10px 0 0;
background: #ccc;
color: #fff;
font-size: 14px;
line-height: 1em;
border-radius: 3px;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
}
.selectBox-txt {
}



/* 画像
*************/
/* 画像丸 */
.imgradius img {
border-radius: 50%;
-webkit-border-radius: 50%;
-moz-border-radius: 50%;
}

/* アーカイブ */
#contents .wrap_archives {
position: relative;
padding: 2% 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: 3px 10px;
color: #fff;
font-size: 16px;
font-family: 'Dinpro';
text-align: center;
background: #000;
}
#contents .in_archives {
width: 103%;
overflow: hidden;
font-family: 'Noto Sans JP';
}
@media screen and (max-width: 1210px) {
#contents .wrap_archives {
position: relative;
padding: 5% 3% 0 3%;
}
#contents .in_archives {
width: 100%;
}
}


/* 引用デザイン */
.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: 1210px){
.blockquote {
width: 100%;
}
}

/* 下からふわっと表示 */
.fadein {
opacity : 0;
transform: translateY(20px);
transition: all 1s;
}


/* 電話番号 */
#contents .tel {
padding: 0 0 0 40px;
color: #fff;
font-size: 45px;
line-height: 1.1em;
font-family: 'FjallaOne-Regular';
}
#contents .tel a {
color: #000000;
text-decoration: none;
}

#contents .tel2 {
color: #ff6532;
font-size: 45px;
line-height: 1.1em;
font-family: 'Dinpro';
}
#contents .tel2 a {
color: #000000;
text-decoration: none;
}


@media only screen and (max-width: 1210px){
#contents .tel {
padding: 0 0 0 40px;
font-size: 40px;
background: url(../img/ico_tel2.png) 0 15px no-repeat;
}
#contents .tel2 {
font-size: 40px;
}
}


/* PC用
------------------------------------------------------------*/
@media only screen and (min-width: 1210px){
*, *: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: 22px;
}
#contents .col5 {
width: 194px;
margin-right: 20px;
}

.alignleft,
.alignright {
max-width:100%;
height: auto;
text-align: center;
display: block;
}
}



/* 767以下
------------------------------------------------------------*/
@media only screen and (max-width: 1209px){
*, *: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,
#contents .col4 {
width: 98%;
margin-right: auto;
margin-left: auto;
text-align: center;
clear: both;
float: none;
}

#contents .col5 {
width: 98%;
text-align: center;
margin-right: auto;
margin-left: auto;
clear: both;
float: none;
}

.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:1050px;
}


.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;
}

}