@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:#555;
font-family: 'Noto Sans JP', "メイリオ", sans-serif;
font-size: 100%;
font-size:17px;
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;
}


img[src*="analytics.global-websystem.net"] {
    position: absolute;
    left: -100px;
    bottom: -100px;
}



@media screen and (min-width:768px){
    
    .topspcatch{
        display: none !important;
    }  
}
@media screen and (max-width:767px){
    
    .topspcatch{
        display: block !important;
        margin: 0px;
        padding: 30px 0px 5px 0px;
        width: 100%;
    }  
    .catchimg {
        width: 90%;
        height: auto;
        max-width: 520px;
        margin: 10px auto 5px;
    }
     .catchimg img{
        width: 100%;
        height: auto;
    }
    
    
}



/*areaedit
------------------------------------------------------------*/

.wcarea_400207806601 .col2,
.wcselect_400207806601 .col2{
position :static !important;
width: 480px !important;
margin-right: 5px !important;
display: inline-block !important;
vertical-align: top;
}


.wcarea_400207806601 .col3,
.wcselect_400207806601 .col3{
position :static !important;
width: 336px !important;
margin-right: 5px !important;
display: inline-block !important;
vertical-align: top;
}


.wcarea_400207806601 .col4,
.wcselect_400207806601 .col4{
position :static !important;
width: 246px !important;
margin-right: 5px !important;
display: inline-block !important;
vertical-align: top;
}
.wcarea_400207806601 .col5,
.wcselect_400207806601 .col5{
position :static !important;
width: 194px !important;
margin-right: 5px !important;
display: inline-block !important;
vertical-align: top;
}


@media screen and (min-width: 768px) {
.wrap5 li {
    width: 231px !important;
}
.wrap5 .wrap_spr3_2 img {
    width: 100% !important;
    height: auto;
}

}


@media screen and (max-width: 767px) {
.wrap5 li {
    width: 45% !important;
}
.wrap5 .wrap_spr3_2 img {
    width: 100% !important;
    height: auto;
}

}


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



/* 全体
------------------------------------------------------------*/
.inner {
width:100%;
margin:0 auto;
clear: both;
}
@media only screen and (min-width: 767px){
.inner {
width: 1200px;
}
}
@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;
}
#contents .inner {
width: 100%;
margin: 0 auto;
}
@media only screen and (min-width: 1200px){
#contents {
padding: 0px 0 0 0;
}
#contents .contents {
width: 1050px;
}
#contents .inner {
width: 1050px;
}
}
@media only screen and (max-width: 1200px){
#contents {
padding: 0px 0 0 0;
}
}
@media only screen and (max-width:767px){
#contents {
padding: 0px 0 0 0;
}
#contents .contents {
width: 100%;
}
#contents .inner {
width: 94%;
}
}


/* 固定背景
*************/
.fixed-bgcont {
position: relative;
min-height: 37vh;
background-attachment: fixed;
background-size: cover;
background-position: center;
z-index: 1;
}
.bgcont {
background-image: url(../img/title.jpg);
}


/* 画像自動縮小
*************/
#header img,
#footer img,
#top img,
#top1 img,
#topbn img,
.page-visual-ttl img,
#title img,
#bn_contact img,
.logo img,
.box_line img,
.images img,
.stepr img,
.stepl img,
.boxbeaf img,
.ribbon11-wrapper img,
.wrap_voice2 img,
.wrap1 img,
.wrap2 img,
.wrap3 img,
.wrap4 img,
.wrap5 img,
.wrap6 img,
.wrap7 img,
.wrap8 img,
.wrap9 img,
.list 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;
}
.fontsize11 {
font-size: 11px;
}
.fontsize12 {
font-size: 12px;
}
.fontsize13 {
font-size: 13px;
}
.fontsize14 {
font-size: 14px;
}
.fontsize15 {
font-size: 15px;
}
.fontsize16 {
font-size: 16px;
}
.fontsize17 {
font-size: 17px;
}
.fontsize18 {
font-size: 18px;
}
.fontsize20 {
font-size: 20px;
}
.fontsize22 {
font-size: 22px;
}
.fontsize24 {
font-size: 24px;
}
.fontsize26 {
font-size: 26px;
}
.fontsize28 {
font-size: 28px;
}
.fontsize30 {
font-size: 30px;
}
.fontsize34 {
font-size: 34px;
}
.fontsize40 {
font-size: 40px;
}
.lightheight1 {
line-height: 1.5em;
}
.lightheight2 {
line-height: 2em;
}
.lightheight3 {
line-height: 1.2em;
}



/* fontcolor */
.fontred {
color: #d1161e;
}
.fontpink {
color: #f0465a;
}
.fontblue {
color: #0c91d6;
}
.navyblue {
color: #0f1565;
}
.fontorange {
color: #eb6100;
}
.fontgreen {
color: #237441;
}

.strong {
font-weight: bold;
}

strong {
font-weight: bold;
}

/* fontfamily */
.family_noto {
font-family: 'Noto Sans JP';
}
.family1 {
font-family: 'YuMin';
}
.family2 {
font-family: 'Dinpro';
}
.family3 {
font-family: 'ShinMGoPro-R';
}

@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-30 {margin-top: -30px!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;
overflow: hidden;
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;
clear: both;
}
section.content4 {
width: 103%;
padding: 0 0 0 0;
margin: 0 0 0 0;
clear: both;
}
section.content5 {
width: 100%;
padding: 0 0 0 0;
margin: -10% 0 10% 0;
clear: both;
}
section.content6 {
width: 100%;
padding: 0 0 0 0;
margin: -10% 0 10% 0;
}
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;
}

div.contentbox2 {
width: 100%;
overflow: hidden;
}


@media only screen and (min-width: 767px){
section.content {
    width: 1050px;
    margin-top: 0;
    margin-right: 0;
    margin-left: 0;
    margin-bottom: 40px;
}
section.content2 {
width: 1090px;
margin: 0 0 100px 0;
}
section.content3 {
width: 1050px;
}
section.content4 {
width: 1090px;
}
section.content5 {
width: 1050px;
margin: -180px 0 100px 0;
}
section.content7 {
width: 1050px;
margin: 0 0 50px 0;
}
}
@media only screen and (max-width: 767px){
section.content,
section.content2,
section.content3,
section.content4,
section.content5,
section.content6,
section.content7 {
width: 100%;
}
div.contentbox2 {
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: relative;
width: 100%;
height: 246px;
letter-spacing: 0;
padding: 40px 0 40px 0;
margin: 0 auto;
background: url(../img/bg_header.png) left top no-repeat;
background-size: cover;
z-index: 999;
}
#header .inner {
position: relative;
width: 100%;
margin: 0 auto;
}
#header ul.hm {
display: -webkit-flex;
display: flex;
-webkit-justify-content: space-between;
justify-content: space-between;
align-items: center;
}
#header .logo {
margin: 0 auto 5px auto;
}
#header .logo2 {
color: #fff;
font-size: 16px;
font-weight: 300;
letter-spacing: 2px;
}


/* transition */
#header,
#header .logo {
-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,
#header .logo {
-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: 40px 0 40px 0;
}
#header.fixed .logo {
}

@media only screen and (min-width: 1200px){
#header .inner {
width: 1200px;
}
}
@media only screen and (max-width: 1200px){
#header .inner {
width: 96%;
}
}
@media only screen and (max-width: 767px){
#header {
height: 160px;
padding: 20px 0 0px 0;
}
#header.fixed {
padding: 20px 0 0px 0;
}
#header .logo {
margin: 0 70px 5px 0;
}
#header .logo2 {
font-size: 14px;
text-align: left;
}
}


/* header link
*************/
#header a {
color: #5b5959;
-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:#828282; text-decoration: none;}



/* --------------------------------------------------
HdrNavi
-------------------------------------------------- */
/* HdrNavi
*************/
nav#HdrNavi {
position: relative;
margin: 0 auto;
z-index: 10;
}
nav#HdrNavi.Fixed {
max-width:initial;
max-width:auto;
width:100%;
top:0;
left:0;
z-index:100;
}
nav#HdrNavi ul {
display: -webkit-flex;
display: flex;
-webkit-justify-content: center;
justify-content: center;
-webkit-align-items: center;
align-items: center;
}
nav#HdrNavi > ul > li {
position:relative;
text-align:left;
font-size: 20px;
line-height: 1em;
font-weight: 400;
}
nav#HdrNavi > ul > li::after {
content: ' ';
position: absolute;
top: 10px;
left: -15px;
width: 0;
height: 0;
border: none;
border-top: 5px solid #fff;
border-right: 5px solid transparent;
border-left: 5px solid transparent;
}
nav#HdrNavi li a {
padding: 0px 50px 10px 0px;
color: #fff;
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;
}
nav#HdrNavi li a:hover{
color: #ecb2b2;
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;
display:block;
}

nav#HdrNavi ul.SubMenu {
position:absolute;
width: 210px;
text-align:left;
box-sizing:border-box;
top: 30px;
left: -65px;
display:none;
z-index:20;
}
nav#HdrNavi ul.SubMenu 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;
}
nav#HdrNavi > ul > li:hover ul.SubMenu {
display:block;
}
nav#HdrNavi ul.SubMenu li {
text-align: center; /* テキスト位置 */
border-left: none;
}
nav#HdrNavi ul.SubMenu li a {
height: auto;
padding: 20px 10px 20px 10px;
display:block;
text-decoration: none;
color:#333;
background:rgba(255,255,255,0.7);
font-size: 18px;
line-height: 1.3em;
border: none;
}
nav#HdrNavi ul.SubMenu li a:hover{
padding: 20px 10px 20px 10px;
color:#fff;
background: #c00000;
}

@media only screen and (min-width: 767px){
nav#HdrNavi {
width: 670px;
}
}
@media only screen and (max-width: 1200px){
nav#HdrNavi {

}
nav#HdrNavi > ul > li {
font-size: 16px;
}
nav#HdrNavi ul.SubMenu {
position:absolute;
width: 170px;
text-align:left;
box-sizing:border-box;
top: 20px;
left: -50px;
display:none;
z-index:20;
}
nav#HdrNavi ul.SubMenu li a{
font-size: 14px;
}
}
@media only screen and (max-width: 767px){
nav#HdrNavi ul.SubMenu {
top: 35px;
}
}


/* footer
*************/
.bgfooter img {
max-width:100%;
height:auto;
}
#footer {
position: relative;
width: 100%;
padding: 0px 0 50px 0;
letter-spacing: 0;
background: #2a2a2a;
color: #fff;
z-index: 0;
}
#footer ul.fm {
display: -webkit-flex;
display: flex;
text-align: left;
}
#footer ul.fm li {
width: 50%;
}
#footer .flogo {
margin: 0 auto 5px auto;
}
#footer .flogo2 {
margin: 0 auto 20px auto;
color: #fff;
font-size: 16px;
font-weight: 300;
letter-spacing: 2px;
}
#footer .fadd {
margin: 0 auto 10px auto;
font-size: 16px;
font-weight: 400;
line-height: 1.6em;
}
#footer ul.sns {
width: 300px;
margin: 0 0 0 auto;
display: -webkit-flex;
display: flex;
}


@media only screen and (min-width: 767px){
#footer .inner {
width: 1200px;
}
}
@media only screen and (max-width: 767px){
#footer {
padding: 0px 0 30px 0;
}
#footer .inner {
width: 94%;
}
#footer ul.fm {
-webkit-flex-direction: column;
flex-direction: column;
text-align: center;
}
#footer ul.fm li {
width: 100%;
}
#footer .flogo2 {
margin: 0 auto 20px auto;
font-size: 14px;
}
#footer ul.sns {
margin: 20px auto 0 auto;
}
}


/* footnav
*************/
nav#footnav {
position: relative;
width: 100%;
display: -webkit-flex;
display: flex;
}
nav#footnav ul {
width: 50%;
}
nav#footnav ul li.t1 {
width: 100%;
padding: 0 0 0 10px;
background: url(../img/img_fnavi1.png) 0 12px no-repeat;
}
nav#footnav ul li.t2 {
width: 100%;
padding: 0 0 0 28px;
background: url(../img/img_fnavi2.png) 15px 6px no-repeat;
}

/* 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:#ccc; text-decoration: none;}


/* copyright */
#copyright {
padding: 20px 0 20px 0;
color: #fff;
font-size: 14px;
text-align: center;
background: #000;
}
@media only screen and (max-width: 767px){
#copyright {
font-size: 10px;
}
}


#footbn {
position: fixed;
width: 100%;
padding: 20px 0 20px 0;
bottom: 0;
left: 0;
background: #dc0d0d;
color: #fff;
z-index: 999;
}
#footbn .inner {
position: relative;
margin: 0 auto;
}
#footbn ul.ftwrap {
display: -webkit-flex;
display: flex;
-webkit-justify-content: space-between;
justify-content: space-between;
align-items: center;
text-align: left;
}
#footbn .inner .fbimg {
position: absolute;
left: 0;
bottom: -20px;
}
#footbn .inner .fbtxt {
position: absolute;
top: -38%;left: 50%;
-webkit-transform: translate(-50%, -38%);
transform: translate(-50%, -38%);
display: none;
}
#footbn .inner .fbtxt img {
filter: drop-shadow(2px 2px 3px rgba(0,0,0,0.6));
}
#footbn .fblogo {
padding: 0 0 0 200px;
}
#footbn .fbtel {
padding: 0 0 0 40px;
background: url(../img/ico_tel.png) 0 10px no-repeat;
font-size: 36px;
font-family: 'Century_Gothic_B';
}
#footbn .fbtime {
padding: 0 0 0 40px;
font-size: 14px;
}
#footbn .fbteltime {
}
#footbn .fbcontact {
}
@media only screen and (min-width: 767px){
#footbn .inner {
width: 1200px;
}
}
@media only screen and (max-width: 767px){
#footbn .inner .fbimg {
display: none;
}
#footbn .fblogo {
display: none;
}
#footbn .fbteltime {
width: 300px;
padding: 0;
margin: 0 auto;
}
#footbn .fbcontact {
display: none;
}
#footbn .fbtel {
font-size: 28px;
}    
    
}


/* main
------------------------------------------------------------*/
/* top
*************/
#top {
position: relative;
width: 100%;
height: auto;
z-index: 0;
clear: both;
}
#top .inner {
width: 100%;
}

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


/* top1 */
#top1 {
position: relative;
width: 100%;
margin: 40px auto 200px auto;
z-index: 8;
}
#top1 .inner {
background: url(../topimg/bg_top1.png) top center no-repeat;
background-size: contain;
}
#top1 h2.t1 {
padding: 5px 0 7px 0;
margin: 0 auto 40px auto;
color: #fff;
font-size: 40px;
line-height: 1.3em;
font-weight: 400;
background: url(../topimg/bg_h2_top1.png) top center no-repeat;
background-size: auto;
}
#top1 ul.wrap_t1 {
display: -webkit-flex;
display: flex;
-webkit-justify-content: space-between;
justify-content: space-between;
}

@media only screen and (min-width: 767px){
#top1 .inner {
width: 1200px;
margin: 0 auto;
}
}
@media only screen and (max-width: 767px){
#top1 {
margin: 40px auto 100px auto;
}
#top1 .inner {
}
#top1 h2.t1 {
margin: 50px auto 40px auto;
font-size: 4vw;
}
#top1 ul.wrap_t1 li {
margin-bottom: 7%;
}
#top1 ul.wrap_t1 {
flex-wrap: wrap;
}
#top1 ul.wrap_t1 li {
width: 48%;
margin-bottom: 5%;
}
#top1 ul.wrap_t1::after,
#top1 ul.wrap_t1::before {
content: "";
display: block;
width: 48%;
height: 0;
}
#top1 ul.wrap_t1::before {
order: 1;
}
}


/* top2 */
#top2 {
position: relative;
width: 100%;
margin: 0 auto;
}
#top2 .inner {
position: relative;
margin: 0 auto;
}
#top2 .inner h2.t2 {
position: absolute;
left: 0;
top: 0;
z-index: 99;
}
#top2 .wrap_t2_1 {
position: relative;
overflow: hidden;
z-index: 0;
}
#top2 .wrap_t2_1 .t2_1txt {
width: 400px;
position: absolute;
color: #fff;
font-size: 40px;
font-weight: 400;
top: 40%;right: 10%;
-webkit-transform: translate(-10%, -40%);
transform: translate(-10%, -40%);
z-index: 9;
}
#top2 .wrap_t2_1 .t2_1no {
width: 150px;
position: absolute;
top: 20%;right: 10%;
-webkit-transform: translate(-10%, -20%);
transform: translate(-10%, -20%);
z-index: 8;
}
#top2 .bg_t2_1 {
position: absolute;
z-index: 2;
}
#top2 .bg_t2_1 img {
width: auto;
min-height: 495px;
object-fit: cover;
}
#top2 .t2_1pho {
text-align: left;
}

/* 2 */
#top2 .wrap_t2_2 {
position: relative;
overflow: hidden;
z-index: 0;
}
#top2 .wrap_t2_2 .t2_2txt {
width: 450px;
position: absolute;
color: #fff;
font-size: 40px;
font-weight: 400;
top: 60%;left: 20%;
-webkit-transform: translate(-20%, -60%);
transform: translate(-20%, -60%);
z-index: 9;
}
#top2 .wrap_t2_2 .t2_2no {
width: 150px;
position: absolute;
top: 45%;left: 10%;
-webkit-transform: translate(-10%, -50%);
transform: translate(-10%, -50%);
z-index: 8;
}
#top2 .bg_t2_2 {
position: absolute;
z-index: 2;
}
#top2 .bg_t2_2 img {
width: auto;
min-height: 495px;
object-fit: cover;
}
#top2 .t2_2pho {
text-align: right;
}


@media only screen and (min-width: 767px){
#top2 .inner {
width: 1200px;
}
#top2 .t2_1pho {
width: 100%;
padding: 75px 0 0 0;
}
#top2 .t2_1pho img {
width: auto;
min-height: 300px;
object-fit: cover;
}
#top2 .bg_t2_1s {
display: none;
}

/* 2 */
#top2 .t2_2pho {
width: 100%;
padding: 0 0 75px 0;
}
#top2 .t2_2pho img {
width: auto;
min-height: 300px;
object-fit: cover;
}
#top2 .bg_t2_2s {
display: none;
}
}
@media only screen and (max-width: 767px){
#top2 .inner h2.t2 {
width: 200px;
position: absolute;
left: 0;
top: -40px;
z-index: 99;
}
#top2 .wrap_t2_1 .t2_1txt {
width: 100%;
font-size: 30px;
top: 80%;left: 50%;
-webkit-transform: translate(-50%, -80%);
transform: translate(-50%, -80%);
z-index: 9;
}
#top2 .t2_1pho {
width: 100%;
padding: 0 0 15vh 0;
}
#top2 .t2_1pho img {
width: auto;
min-height: 300px;
object-fit: cover;
}
#top2 .bg_t2_1 {
display: none;
}
#top2 .bg_t2_1s {
position: absolute;
z-index: 2;
}
#top2 .bg_t2_1s img {
width: auto;
min-height: 400px;
object-fit: cover;
}
#top2 .wrap_t2_1 .t2_1no {
width: 50px;
position: absolute;
top: 70%;right: 10%;
-webkit-transform: translate(-10%, -70%);
transform: translate(-10%, -70%);
z-index: 8;
}

/* 2 */
#top2 .wrap_t2_2 .t2_2txt {
width: 100%;
font-size: 30px;
top: 85%;left: 50%;
-webkit-transform: translate(-50%, -80%);
transform: translate(-50%, -80%);
z-index: 9;
}
#top2 .t2_2pho {
width: 100%;
padding: 0 0 15vh 0;
}
#top2 .t2_2pho img {
width: auto;
min-height: 300px;
object-fit: cover;
}
#top2 .bg_t2_2 {
display: none;
}
#top2 .bg_t2_2s {
position: absolute;
z-index: 2;
}
#top2 .bg_t2_2s img {
width: auto;
min-height: 400px;
object-fit: cover;
}
#top2 .wrap_t2_2 .t2_2no {
width: 50px;
position: absolute;
top: 75%;right: 10%;
-webkit-transform: translate(-10%, -70%);
transform: translate(-10%, -70%);
z-index: 8;
}

}


/* top3 */
#top3 {
position: relative;
width: 100%;
min-height: 876px;
padding: 180px 0 0 0;
margin: 0 auto 40px auto;
background: url(../topimg/bg_top3.jpg) top center no-repeat;
background-size: cover;
z-index: 3;
}
#top3 ul.wrap_t3 {
position: relative;
display: -webkit-flex;
display: flex;
}
#top3 ul.wrap_t3 li {
width: 50%;
text-align: left;
}
#top3 ul.wrap_t3 li.phol {
position: relative;
padding: 70px 0 0 0;
}
#top3 ul.wrap_t3 .wk {
position: absolute;
width: 1200px;
height: 530px;
left: 0;
top: 0;
z-index: 4;
}
#top3 ul.wrap_t3 li.txtr {
z-index: 9;
}
#top3 .t3cont {
margin: 80px 0 0 60px;
}
#top3 h2.t3 {
width: 100%;
padding: 0px 0 10px 0;
margin: 0 0 20px 0;
color: #000;
font-size: 28px;
line-height: 1.3em;
font-weight: 400;
border-bottom: 1px solid #c00000;
}
#top3 h3.t3 {
margin: 0 0 10px 0;
color: #c00000;
font-size: 22px;
line-height: 1.3em;
font-weight: 400;
}
#top3 p.t3_txt {
margin: 0 auto 70px auto;
}
#top3 .t3_more {
margin: 0 auto;
text-align: center;
}


@media only screen and (min-width: 767px){
#top3 .inner {
width: 1200px;
margin: 0 auto;
}
}
@media only screen and (max-width: 767px){
#top3 {
padding: 80px 0 0 0;
background-size: contain;
background: url(../topimg/bg_top3.jpg) top center no-repeat , #f4f4f4;
}
#top3 .inner {
background: url(../topimg/bg_top3_2.png) center 20px no-repeat;
background-size: contain;
}
#top3 ul.wrap_t3 li.phol {
max-width: 400px;
margin: 0 auto;
}
#top3 ul.wrap_t3 {
-webkit-flex-direction: column;
flex-direction: column;
}
#top3 ul.wrap_t3 li {
width: 100%;
text-align: center;
}
#top3 h2.t3 {
margin: 0 0 10px 0;
}
#top3 ul.wrap_t3 .wk {
display: none;
}
#top3 .t3cont {
margin: 10px 0 0 0px;
}
#top3 p.t3_txt {
margin: 0 auto 20px auto;
}
}
@media only screen and (max-width: 320px){
#top3 ul.wrap_t3 li.phol {
width: 100%;
}
}



/* top4 */
#top4 {
position: relative;
width: 100%;
margin: 0 auto;
color: #fff;
z-index: 0;
}
#top4 .t4bg {
width: 1920px;
position: absolute;
left: 0;
bottom: 0;
z-index: 4;
}
#top4 .t4bgs {
position: absolute;
left: 0;
bottom: 0;
z-index: 4;
}
#top4 .t4bgs img {
width: auto;
min-height: 400px;
object-fit: cover;
}
#top4 .t4_pho {
width: 1120px;
padding: 0 0 5% 0;
text-align: left;
z-index: 3;
}
#top4 .wrap_t4 {
width: 500px;
position: absolute;
top: 50%;right: 10%;
-webkit-transform: translate(-10%, -50%);
transform: translate(-10%, -50%);
z-index: 9;
}
#top4 h2.t4 {
margin: 0 auto 20px auto;
font-size: 40px;
font-weight: 400;
}
#top4 p.t4_txt {
margin: 0 auto 50px auto;
font-size: 16px;
}
#top4 .t4_more {
}

@media only screen and (min-width: 767px){
#top4 .t4bg {
width: 100%;
}
#top4 .t4_pho {
width: 60%;
}
#top4 .t4bgs {
display: none;
}
}
@media only screen and (max-width: 1400px){
#top4 .wrap_t4 {
top: 50%;right: 2%;
-webkit-transform: translate(-2%, -50%);
transform: translate(-2%, -50%);
}
}
@media only screen and (max-width: 767px){
#top4 .t4bg {
display: none;
}
#top4 .t4_pho {
width: 100%;
padding: 0 0 55% 0;
}
#top4 .t4_pho img {
width: auto;
min-height: 500px;
object-fit: cover;
}
#top4 .wrap_t4 {
width: 100%;
top: 80%;left: 50%;
-webkit-transform: translate(-50%, -80%);
transform: translate(-50%, -80%);
}
#top4 h2.t4 {
margin: 0 auto 10px auto;
font-size: 30px;
}
}


#top5 {
position: relative;
width: 100%;
padding: 0 0 0px 0;
margin: 0 auto;
}
#top5 ul.wrap_t5 {
display: -webkit-flex;
display: flex;
-webkit-justify-content: space-between;
justify-content: space-between;
align-items: center;
}
#top5 ul.wrap_t5 li.t5ttl {
width: 40%;
}
#top5 ul.wrap_t5 li.t5news {
width: 60%;
}

@media only screen and (max-width: 767px){
#top5 {
padding: 0 0 100px 0;
}
#top5 ul.wrap_t5 {
-webkit-flex-direction: column;
flex-direction: column;
}
#top5 ul.wrap_t5 li.t5ttl {
width: 100%;
}
#top5 ul.wrap_t5 li.t5news {
width: 100%;
}
}

/* news */
#news {
margin: 0 auto;
}
#news .news {
width: 100%;
height: 320px;
margin: 0 auto;
overflow: auto;
}
#news dl {
width: 100%;
padding: 20px 0px;
margin: 0px 0 20px 0;
display: -webkit-flex;
display: flex;
align-items: flex-start;
}
#news dl dt {
width: 20%;
text-align: left;
font-weight: 400;
}
#news dl dd {
width: 80%;
text-align: left;
font-weight: 400;
}


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

}
@media only screen and (max-width: 767px){
#news .news {
width: 94%;
}
#news dl {
width: 100%;
padding: 10px;
margin: 0px auto 20px auto;
-webkit-flex-direction: column;
flex-direction: column;
}
#news dl dt {
width: 100%;
margin: 0 auto;
}
#news dl dd {
width: 100%;
margin: 0px 0 0 0;
}
}


/* contact */
#contact {
position: relative;
width: 100%;
padding: 3% 0;
margin: 0 auto 7% auto;
overflow: hidden;
text-align: center;
border: 5px solid #000;
clear: both;
}
#contact .logo {
margin: 0 0 10px 0;
}
#contact .contxt1 {
margin: 0 0 20px 0;
color: #000;
font-size: 22px;
font-weight: 400;
}
#contact .timecon {
padding: 0 0 0 5px;
font-size: 13px;
font-weight: 400;
}
#contact .add {
margin: 0 0 10px 0;
font-size: 16px;
}
#contact .ftel {
padding: 0 0 0 70px;
color: #fe0000;
font-size: 38px;
font-weight: 400;
letter-spacing: 2px;
background: url(../img/ico_tel.png) 0 5px no-repeat;
}
#contact ul.wrap_contact {
width: 80%;
margin: 0 auto;
display: -webkit-flex;
display: flex;
}
#contact ul.wrap_contact li.conl {
margin-right: 40px;
}
#contact .bn_contact {
position: relative;
width: 50%;
margin: 0 auto 0 auto;
font-size: 18px;
font-weight: 400;
line-height: 1.3em;
}
#contact .bn_contact a {
padding: 20px;
text-align: center;
text-decoration: none;
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;
box-sizing: border-box;
display: block;
background: #c00000;
border-radius: 5px;-webkit-border-radius: 5px;-moz-border-radius: 5px;
}
#contact .bn_contact a:hover {
opacity: 0.6;
filter: alpha(opacity=60);
-ms-filter: "alpha(opacity=60)";
-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;
}
ul.wrap_contact2 {
width: 100%;
margin: 0 auto;
display: -webkit-flex;
display: flex;
-webkit-justify-content: space-between;
justify-content: space-between;
align-items: center;
}
ul.wrap_contact2 li.conl {
}
.ftel2 {
padding: 0 0 0 40px;
color: #fe0000;
font-size: 36px;
font-weight: 400;
letter-spacing: 2px;
background: url(../img/ico_tels.png) 0 14px no-repeat;
}
.bn_contact2 {
position: relative;
width: 100%;
margin: 0 auto 0 auto;
font-size: 18px;
font-weight: 400;
line-height: 1.3em;
}
.bn_contact2 a {
padding: 20px 50px;
text-align: center;
text-decoration: none;
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;
box-sizing: border-box;
display: block;
background: #fe0000;
border-radius: 5px;-webkit-border-radius: 5px;-moz-border-radius: 5px;
}
.bn_contact2 a:hover {
opacity: 0.6;
filter: alpha(opacity=60);
-ms-filter: "alpha(opacity=60)";
-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;
}
@media only screen and (min-width: 767px){
#contact ul.wrap_contact {
width: 780px;
}
ul.wrap_contact2 {
width: 640px;
}
}
@media only screen and (max-width: 767px){
#contact {
padding: 3%;
}
#contact ul.wrap_contact {
-webkit-flex-direction: column;
flex-direction: column;
}
#contact ul.wrap_contact li.conl {
margin-right: 0;
margin-bottom: 20px;
}
ul.wrap_contact2 {
margin: 20px 0 0 0;
-webkit-flex-direction: column;
flex-direction: column;
}
ul.wrap_contact2 li.conl {
margin-right: 0;
margin-bottom: 10px;
}
#contact .bn_contact {
width: 80%;
}
}


/* 吹き出し */
.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 0;
border-top:3px solid #333;
border-bottom:3px solid #333;
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 0;
border-bottom:3px solid #333;
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 .w30 {
width: 30%;
}
table.table .w50 {
width: 50%;
}
table.table .color1 {
background: #c9edff;
}
table.table .color2 {
color: #fff;
background: #cf6116;
}
@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:3px solid #333;
text-align: center;
}
table.table td {
overflow: hidden;
border-bottom:1px solid #c9c9c9;
}
table.table .w {
width: 100%;
}
table.table .w50 {
width: 100%;
}
table.table .w30 {
width: 100%;
}
}

/* table2
*************/
table.table2 {
border-collapse:collapse;
width:1050px;
margin:0px auto 0px auto;
clear: both;
}
table.table2 th {
padding: 20px 0;
border-top:3px solid #333;
border-bottom:3px solid #333;
vertical-align: middle;
font-weight: 400;
}
table.table2 td {
padding: 20px 0;
border-top:1px solid #c9c9c9;
border-bottom:1px solid #c9c9c9;
vertical-align: middle;
}
table.table2 th + th {
padding: 20px 0;
border-bottom:3px solid #333;
vertical-align: middle;
font-weight: 400;
}
table.table2 td + td {
padding: 20px 0;
border-bottom:1px solid #c9c9c9;
vertical-align: middle;
}
table.table2 .w {
width: 30%;
}
table.table2 .w30 {
width: 30%;
}
table.table2 .w50 {
width: 50%;
}


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

@media only screen and (min-width: 768px) {
table.table3 th,
table.table3 th + th {
width: 200px;
}
}

/* table4
*************/
table.table4 {
width: 100%;
margin:0px auto 0px auto;
border-collapse: collapse;
border: solid 3px #2d8b67;
}
table.table4 th, table.table4 td {
padding: 10px;
border: dashed 1px #2d8b67;
}
table.table4 th {
width: 40%;
border-bottom: solid 2px #2d8b67;
background: #dcefe8;
color: #2d8b67;
font-size: 20px;
font-weight: 400;
text-align: center;
}
table.table4 td.color1 {
color: #f0465a;
font-size: 22px;
text-align: center;
font-weight: 400;
}


/* table5 透明テーブル
*************/
table.table5 {
border-collapse:collapse;
width:100%;
margin:0px auto 0px auto;
font-family: 'Noto Sans JP';
text-align: left;
clear: both;
}
table.table5 th {
width: 25%;
}

/* table5
*************/
table.table5 {
border-collapse:collapse;
width:100%;
margin:0px auto 0px auto;
font-size: 16px;
line-height: 1.3em;
font-family: 'Noto Sans JP';
clear: both;
}
table.table5 th,table.table5 td {
padding: 10px;
border:1px solid #dcdcdc;
vertical-align: middle;
}
table.table5 th {
width: 25%;
background: #f4f5f7;
text-align: center;
font-weight: 400;
}
table.table5 td {
text-align: left;
}
table.table5 .w25 {
width: 25%;
}


/* 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: #f7f7f7;
width: 100%;
padding: 1.5em 1.2em;
}
.c-form-1 textarea {
min-height: 10em;
width: 100%;
}


/*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;
}

/**/
.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;
}
.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: 1em 38px 1em 1em;
color: #666666;
}

/* googlemap
*************/
.ggmap {
position: relative;
padding-bottom: 41%;
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: 20px;
margin: 0;
height: 0;
overflow: hidden;
}
.ggmap2 iframe,
.ggmap2 object,
.ggmap2 embed {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}

@media only screen and (max-width: 767px){
.ggmap2 {
position: relative;
padding-bottom: 40%;
padding-top: 20px;
}
}

/* 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: -180px 0 5% 0;
clear: both;
}
.page-visual-ttl .page-visual {
position: absolute;
width: 100%;
padding: 1% 0 2% 0;
left: 0;
bottom: 0;
background: rgba(0,0,0,0.3);
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: #ccc;
}
.page-visual-ttl .page-visual::after {
content: "";
display: block;
position: absolute;
bottom: -20px;
left: 50%;
width: 2px;
height: 20px;
margin-left: -1px;
background-color: #d3002b;
}
.page-visual-ttl .jp {
color: #fff;
font-size: 40px;
font-weight: 700;
display: block;
text-shadow: 3px 3px 0px  #d3002b;
}


.page-visual-ttl .en {
color: #fff;

font-size: 14px;
font-weight: 400;
}


@media only screen and (max-width:767px){
.page-visual-ttl {
margin: -70px 0 5% 0;
}
.page-visual-ttl .pho img {
height: 200px;
object-fit: cover;
}
.page-visual-ttl .page-visual {
padding: 10px 0 30px 0;
}
.page-visual-ttl .jp {
font-size: 24px;
}
.page-visual-ttl .en {
font-size: 10px;
}
}

/* 見出し
*************/
.h3 {
width: 100%;
position: relative;
padding: 1rem 2rem calc(1rem + 10px);
margin: 0 auto 40px auto;
background: #dc0d0d;
color: #fff;
font-size: 30px;
line-height: 1.3em;
text-align: center;
font-weight: 400;
clear: both;
z-index: 500;
}
.h3:after {
position: absolute;
top: -7px;
left: -7px;
width: 100%;
height: 100%;
content: '';
border: 4px solid #000;
}


/*　見出しデザインオフ　*/

.wcedit_400207806601 .h3,
.wcselect_400207806601 .h3,
.wcancedit_400207806601 .h3 {
 position: static   
}

.wcedit_400207806601 .h3:after,
.wcselect_400207806601 .h3:after,
.wcancedit_400207806601 .h3:after{
 display: none !important;
}


.h4 {
position: relative;
padding: 12px 12px 12px 22px;
margin: 0 0 20px 0;
color: #fff;
font-size: 20px;
line-height: 1.3em;
text-align: left;
background: #c00000;
font-weight: 400;
}
.h4::after {
position: absolute;
top: 50%;
left:10px;
transform:translateY(-50%);
content: '';
width: 7px;
height: 7px;
background-color:white;
border-radius: 50%;
-webkit-border-radius: 50%;
-moz-border-radius: 50%;
}

.h5 {
position: relative;
padding: 5px 0 10px 13px;
margin: 0 0 20px 0px;
color: #000;
font-size: 18px;
line-height: 1.3em;
text-align: left;
font-weight: 400;
font-weight: bold !important;    
border-bottom: 1px solid #000;
clear: both;
}
.h5:before {
content: '';
position: absolute;
bottom: 0;
display: inline-block;
width: 5px;
height: 100%;
left: 0;
background-color: #dc0d0d;
}

@media only screen and (min-width: 767px){
}
@media only screen and (max-width: 767px){
.h3 {
font-size: 22px;
}
.h4 {
font-size: 18px;
}
.h5 {
font-size: 16px;
}
}



/* カラム
*************/
#contents .col1 {
text-align: center;
}
#contents .col2 {
position: relative;
margin: 0 3% 8% 0;
/*float: left;*/
display:inline-block;
vertical-align: top;
width: 47%;
text-align: left;
}
#contents .col3 {
position: relative;
margin: 0 3% 8% auto;
width: 30%;
float: left;
text-align: left;
}
#contents .col4 {
position: relative;
margin: 0 3% 8% 0;
width: 22%;
text-align: left;
float: left;
}
#contents .col5 {
margin: 0 3% 8% 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 .col2 .space {
padding: 0 0 20% 0;
}
#contents .col2 .waku1 {
width: 100%;
padding: 10px;
text-align: center;
border: 1px solid #000;
position: absolute;
bottom: 0;
left: 0;
}


@media only screen and (max-width: 768px) {
#contents .col2 .space {
padding: 0 0 30% 0;
}
}


/* 装飾デザイン
*************/
/* box_line */
.box_line {
position: relative;
padding: 2em 3em 2em 2em;
-webkit-background: linear-gradient(-155deg, rgba(0, 0, 0, 0) 1.5em, #f4f4f4 0%);
background: linear-gradient(-155deg, rgba(0, 0, 0, 0) 1.5em, #f4f4f4 0%);
text-align: left;
}
.box_line::after {
position: absolute;
top: 0;
right: 0;
content: '';
width: 1.65507em;
height: 3.5493em;
background: -webkit-linear-gradient(to left bottom, rgba(0, 0, 0, 0) 50%, rgba(0, 0, 0, .1) 0%, rgba(0, 0, 0, .2));
background: linear-gradient(to left bottom, rgba(0, 0, 0, 0) 50%, rgba(0, 0, 0, .1) 0%, rgba(0, 0, 0, .2));
border-bottom-left-radius: 6px;
box-shadow: -.2em .2em .3em -.1em rgba(0, 0, 0, .15);
-webkit-transform: translateY(-1.89424em) rotate(-40deg);
transform: translateY(-1.89424em) rotate(-40deg);
-webkit-transform-origin: bottom right;
transform-origin: bottom right;
}

/* box_line2 */
.box_line2 {
padding: 2em 1em;
width: 100%;
border: 5px dotted #97cc00; /*太さ・線種・色*/
background-color: #fff; /* 背景色 */
border-radius: 1px; /*角の丸み*/
}

/* box_line3 */
.box_line3{
padding: 1em 1em;
margin: 2em 0;
background: #ffeaea;/*背景色*/
border-top: solid 10px #ed2e2e;
}



/* ボタン */
.buttonbox {
margin: 20px auto 0px auto;
text-align: center;
clear: both;
}
.buttonbox1 {
margin: 20px auto 0px auto;
text-align: center;
clear: both;
}
.buttonbox2 {
width: 50%;
margin: 0px auto 80px auto;
text-align: center;
clear: both;
}
.buttonbox3 {
width: 400px;
margin: 50px 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;
}

@media only screen and (max-width: 768px) {
}
@media only screen and (max-width: 768px) {
.buttonbox {
width: 100%;
margin: 5% auto 0px auto;
}
.buttonbox2 {
width: 100%;
}
.buttonbox3 {
width: 100%;
margin: 3% auto 5% auto;
}
.buttonbox4 {
width: 80%;
}
.buttonbox5 {
width: 100%;
}
.buttonboxl2 {
width: 100%;
}
}

.buttonboxr {
margin: 20px auto 0px auto;
text-align: right;
clear: both;
}

/* button1 */
.button01 {
width: 100%;
margin: 0 auto;
}
.button01 a {
position: relative;
padding: 20px 20px;
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: #c00000;
z-index: 100;
}
.button01 a::after {
position: absolute;
top: 50%;
right: .5em;
content: '';
margin-top: -5px;
border: 7px solid transparent;
border-top-width: 5px;
border-bottom-width: 5px;
border-left-color: #fff;
transition: all .3s;
}
.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: #fff;
opacity: 0.6;
}
@media only screen and (max-width: 768px) {
.button01 a {
padding: 15px;
}
}

/* button2 */
.button02 {
width: 100%;
margin: 0 auto;
}
.button02 a {
position: relative;
padding: 20px;
text-align:center;
color: #fff;
font-size: 16px;
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: #2d8b67;
z-index: 100;
border-radius: 5px;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
}
.button02 a::after {
position: absolute;
top: 50%;
right: .5em;
content: '';
margin-top: -5px;
border: 7px solid transparent;
border-top-width: 5px;
border-bottom-width: 5px;
border-left-color: #fff;
transition: all .3s;
}
.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: #65a48c;
}
@media only screen and (max-width: 768px) {
.button02 a {
padding: 15px;
}
}


/* button3 */
.button03 {
width: 100%;
margin: 0 auto;
}
.button03 a {
position: relative;
padding: 15px 20px 15px 20px;
text-align:center;
color: #fff;
font-size: 17px;
line-height: 1.2em;
text-decoration:none;
display: block;
border: 1px solid #fff;
-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;
z-index: 100;
}
.button03 a:hover {
color: #097c25;
background: #fff;
border: 1px solid #fff;
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;
}
.button03 a:before {
position: absolute;
content: '';
width: 6px;
height: 6px;
border-top: solid 2px #fff;
border-right: solid 2px #fff;
-webkit-transform: rotate(45deg);
transform: rotate(45deg);
top: 50%;
right: 20px;
margin-top: -3px;
}
.button03 a:hover:before {
border-top: solid 2px #097c25;
border-right: solid 2px #097c25;
-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: 768px) {
.button03 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: 767px){
.menucol1 {
width: 50%;
}
}
@media only screen and (max-width: 767px){
.menucol1 {
width: 100%;
}
.menucol3 {
margin: 0 3% 3% 0;
width: 47%;
}
.menucol4 {
margin: 0 3% 3% 0;
width: 47%;
}
}
@media only screen and (max-width: 680px){
.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 {
display: -webkit-flex;
display: flex;
-webkit-justify-content: center;
justify-content: center;
-webkit-align-items: center;
align-items: center;
}
.wrapbox_n {
display: -webkit-flex;
display: flex;
align-items: center;
}
.wrapbox_c {
display: -webkit-flex;
display: flex;
-webkit-justify-content: center;
justify-content: center;
-webkit-align-items: center;
align-items: center;
}
.flex {
display: -webkit-flex;
display:flex;
}

.wrap1 {
width: 10%;
}
.wrap2 {
width: 20%;
}
.wrap3 {
width: 30%;
}
.wrap4 {
width: 40%;
}
.wrap5 {
width: 50%;
}
.wrap6 {
width: 60%;
}
.wrap7 {
width: 70%;
}
.wrap8 {
width: 80%;
}
.wrap9 {
width: 90%;
}

/* 線 */
.line {
padding: 10px;
margin: 0 20px 0 0;
text-align: center;
background: #eda72e;
border-radius: 5px;-webkit-border-radius: 5px;-moz-border-radius: 5px;
}
.line .no {
color: #fff;
font-size: 30px;
line-height: 1em;
font-weight: bold;
font-family: 'Dinpro';
}

/* 丸中数字 */
.notxt {
width: 45px;
height: 45px;
padding: 6px 0 0 0;
margin: 0 10px 0 0;
border-radius: 50%;
-webkit-border-radius: 50%;
-moz-border-radius: 50%;
color: #5d3000;
font-size: 26px;
text-align: center;
font-family: 'Dinpro';
background: #fbaf42;
}

/* 矢印 */
.wrapar1 {
height: 20vh;
background: url(../img/ar02.png) center center no-repeat;
}
.wrapar2 {
height: 330px;
background: url(../img/ar02.png) center 170px no-repeat;
}


/* 隙間 */
.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%;
}





@media only screen and (max-width: 767px) {
.wrapbox {
-webkit-flex-direction: column;
flex-direction: column;
}
.wrapbox2 {
margin: 50px 0 0 0;
-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/ar01.png) center center no-repeat;
}
.wrapar2 {
height: 64px;
background: url(../img/ar01.png) center center no-repeat;
}
.wrap_spr3 {
margin: 0 0 5% 0;
}
.wrap_spl3 {
margin: 2% 0 0 0;
}
}

/* お客様の声 */
.wrap_voice {
width: 100%;
display: -webkit-flex;
display: flex;
-webkit-align-items: center; /* 縦方向中央揃え（Safari用） */
align-items: center; /* 縦方向中央揃え */
-webkit-justify-content: center; /* 横方向中央揃え（Safari用） */
justify-content: center; /* 横方向中央揃え */
}
.wrap_voice7 {
width: 70%;
}
.wrap_voice2 {
width: 20%;
}
@media only screen and (max-width: 767px) {
.wrap_voice {
-webkit-flex-direction: column;
flex-direction: column;
-webkit-flex-direction: column-reverse;
flex-direction: column-reverse;
}
.wrap_voice7,
.wrap_voice2 {
width: 100%;
margin: 0 auto;
text-align: center;
}
.wrap_voice7 img,
.wrap_voice2 img {
width: 150px;
height: auto;
}
}

/* 矢印レイアウト */
.list {
display: -webkit-box;
display: flex;
flex-wrap: wrap;
-webkit-box-pack: justify;
align-items: flex-start;
}
.list__item1 {
width: 8%;
min-height: 200px;
margin-bottom: 20px;
display: -webkit-box;
display: flex;
-webkit-box-align: stretch;
align-items: flex-start;
}
.list__item4 {
width: 28%;
min-height: 200px;
margin-bottom: 20px;
display: -webkit-box;
display: flex;
-webkit-box-align: stretch;
align-items: flex-start;
flex-wrap: wrap;
}
.list_ar {
background: url(../img/ar02.png) center center no-repeat;
}
.list_n {
display: -webkit-flex;
display: flex;
align-items: center;
}
.list_itemtxt {
display: block;
}

.wcedit_400207806601 .list__item4 {
    width: 294px;
}
.wcedit_400207806601 .list__item4 img {
    width: 100% !important;
    height: auto !important;
}

@media only screen and (max-width: 767px) {
.list {
-webkit-flex-direction: column;
flex-direction: column;
}
.list__item1 {
width: 100%;
min-height: 0;
}
.list__item4 {
width: 100%;
min-height: 0;
}
.list_ar {
height: 50px;
background: url(../img/ar01.png) center center no-repeat;
}
}


/* 画像背景 */
.bgcont1 {
padding: 3em;
text-align: center;
background: url(../../recruit/img/bg1.jpg) top center no-repeat;
background-size: cover;
}
.bgcont1_2 {
padding: 3em;
text-align: left;
background: url(../../recruit/img/bg1_2.jpg) center center no-repeat;
background-size: cover;
}

/* 枠線 */
#contents .line_color1 {
display: -webkit-flex;
display: flex;
align-items: center;
border: 3px solid #2d8b67;
}
#contents .line_color1 .ttl {
width: 30%;
padding: 10px 20px;
background: #dcefe8;
color: #2d8b67;
font-size: 20px;
font-weight: 400;
text-align: center;
}
#contents .line_color1 .txt {
width: 70%;
padding: 10px 20px;
color: #f0465a;
font-size: 22px;
text-align: center;
font-weight: 400;
}


/* アーカイブタイトル */
#contents .archives {
padding: 0 0 10px 0;
margin: 10px 0 15px 0;
color: #333;
font-size: 22px;
font-weight: 700;
line-height: 1.3em;
text-align: center;
border-bottom: 2px solid #e1dad7;
}

/* アーカイブ枠 */
#contents .wrap_archives {
padding: 5px 3% 0 3%;
border: 4px solid #743924;
background: #fff;
}
#contents .in_archives {
width: 103%;
overflow: hidden;
}


/* 色見出し */
.bgstt1 {
width: 100%;
padding: 5px 10px;
color: #fff;
font-size: 18px;
line-height: 1.3em;
font-weight: 400;
text-align: center;
background: url(../img/img_h5.png) center center no-repeat;
background-size: cover;
}

/* 見出し */
.stt1 {
margin: 0 0 5px 0;
color: #666;
font-size: 22px;
font-weight: 400;
text-align: center;
}
.stt2 {
margin: 0 0 5px 0;
color: #c00000;
font-size: 22px;
font-weight: 400;
text-align: center;
}
.stt3 {
padding: 0 0 5px 0;
margin: 0 0 10px 0;
color: #000;
font-size: 22px;
font-weight: 400;
border-bottom: 1px solid #666;
}

/* テキスト装飾 */
.money {
margin: 0 auto 20px auto;
color: #c00000;
font-size: 22px;
font-weight: 400;
text-align: center;
}

/* 枠装飾 */
.waku1 {
padding: 10px;
border: 1px solid #c00000;
}
.waku1 .txt1 {
margin: 0 0 10px 0;
color: #000;
font-size: 18px;
font-weight: 400;
text-align: center;
}
.waku1 .txt2 {
color: #c00000;
font-size: 22px;
font-weight: 400;
text-align: center;
}


/* チェックリスト */
ul.check li {
padding: 0 0 0 40px;
margin: 0 0 30px 0;
font-size: 20px;
font-weight: 400;
text-align: left;
background: url(../img/ico_check.png) 0 0 no-repeat;
}
.check_ttl {
color: #000;
font-size: 30px;
font-family: 'YuGothB';
background: linear-gradient(transparent 70%, #f9cece 70%);
}


/* 矢印リスト */
ul.listar li {
padding: 5px 0 5px 32px;
margin: 0 0 20px 0;
font-size: 20px;
font-weight: 400;
background: url(../img/ico_ar1.png) 0 10px no-repeat;
}


/* アイコンリスト */
ul.listico1 li {
padding: 2px 0 0 38px;
margin: 0 0 10px 0;
font-size: 20px;
font-weight: 400;
text-align: left;
background: url(../img/ico_check.png) 0 0 no-repeat;
}


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


/* before-after */
.befoafter1 {
background: url(../img/ar02.png) center center no-repeat;
}
.befoaftersp {
width: 20%;
}
.befoafter_t1 {
text-align: center;
color: #666;
font-size: 25px;
font-weight: 400;
font-weight: bold;
font-family: 'Dinpro';
}
.befoafter_t2 {
text-align: center;
color: #1c6335;
font-size: 25px;
font-weight: bold;
font-family: 'Dinpro';
}

@media only screen and (max-width: 767px) {
.befoafter1 {
background: url(../img/ar01.png) center center no-repeat;
}
.befoaftersp {
height: 80px;
}
.befoafter_t1 {
font-size: 20px;
}
.befoafter_t2 {
font-size: 20px;
}
}


/* balloon-1 left */
.balloon-1-left {
position: relative;
display: inline-block;
padding: 20px 20px;
width: 100%;
text-align: left;
background: #fff;
border: 3px solid #ececec;
z-index: 0;
}
.balloon-1-left:before {
content: "";
position: absolute;
top: 50%; left: -9px;
margin-top: -9px;
display: block;
width: 0px;
height: 0px;
border-style: solid;
border-width: 9px 9px 9px 0;
border-color: transparent #ececec transparent transparent;
z-index: 0;
}
.balloon-1-left:after {
content: "";
position: absolute;
top: 50%; left: -12px;
margin-top: -10px;
display: block;
width: 0px;
height: 0px;
border-style: solid;
border-width: 10px 10px 10px 0;
border-color: transparent #ececec transparent transparent;
z-index: -1;
}
.balloon-1-right {
position: relative;
display: inline-block;
padding: 20px 20px;
margin: 0 0 20px 0;
width: 100%;
text-align: left;
background: #fff;
border: 5px solid #ececec;
z-index: 0;
}
.balloon-1-right:before {
content: "";
position: absolute;
top: 50%; right: -9px;
margin-top: -9px;
display: block;
width: 0px;
height: 0px;
border-style: solid;
border-width: 9px 0 9px 9px;
border-color: transparent transparent transparent #ececec;
z-index: 0;
}
.balloon-1-right:after {
content: "";
position: absolute;
top: 50%; right: -12px;
margin-top: -10px;
display: block;
width: 0px;
height: 0px;
border-style: solid;
border-width: 10px 0 10px 10px;
border-color: transparent transparent transparent #ececec;
z-index: -1;
}
@media only screen and (max-width: 767px) {
.balloon-1-left {
max-width: 600px;
}
.balloon-1-left:before {
content: "";
position: absolute;
top: -0px; left: 50%;
margin-left: -9px;
display: block;
width: 0px;
height: 0px;
border-style: solid;
border-width: 0 9px 9px 9px;
border-color: transparent transparent #ececec transparent;
z-index: 0;
}
.balloon-1-left:after {
content: "";
position: absolute;
top: -3px; left: 50%;
margin-left: -10px;
display: block;
width: 0px;
height: 0px;
border-style: solid;
border-width: 0 10px 10px 10px;
border-color: transparent transparent #ececec transparent;
z-index: -1;
}

.balloon-1-right {
max-width: 600px;
}
.balloon-1-right:before {
content: "";
position: absolute;
top: -0px; left: 50%;
margin-left: -9px;
display: block;
width: 0px;
height: 0px;
border-style: solid;
border-width: 0 9px 9px 9px;
border-color: transparent transparent #ececec transparent;
z-index: 0;
}
.balloon-1-right:after {
content: "";
position: absolute;
top: -3px; left: 50%;
margin-left: -10px;
display: block;
width: 0px;
height: 0px;
border-style: solid;
border-width: 0 10px 10px 10px;
border-color: transparent transparent #ececec transparent;
z-index: -1;
}
}

/* flow */
.ribbon11-wrapper {  
position: relative;
margin: 0 auto 30px auto;
padding: 20px 0;
width: 100%;
border: 5px solid #595959;
text-align: left;
display: block;
float: left;
}
.ribbon11-wrapper .no1 {
color: #fff;
font-size: 14px;
font-weight: bold;
font-family: 'Dinpro';
}
.ribbon11-wrapper .no2 {
margin: 0 10px 0 0;
color: #fff;
font-size: 30px;
font-family: 'Dinpro';
}
.ribbon11 {
display: inline-block;
position: relative;
box-sizing: border-box;
padding: 5px 20px 5px 20px;
margin: 0 0 0 -25px;
color: #fff;
font-size: 20px;
background: #000;
}
.ribbon11:before {
position: absolute;
content: '';
top: 100%;
left: 0px;
border: none;
border-bottom: solid 15px transparent;
border-right: solid 20px #222;
}
.ribbon11-wrapper .rbox {
padding: 20px;
}
.ribbon11-ar {
width: 100%;
margin: 0 auto 30px auto;
text-align: center;
clear: both;
}
.ribbon11-wrapper .w3r {
text-align: right;
}
@media only screen and (max-width: 767px){
.ribbon11-wrapper .w3r {
text-align: center;
}
}


/* 引用デザイン */
.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(20px);
transition: all 1s;
}


/* 電話番号 */
#contents .tel {
    padding: 0 0 0 10px;
    color: #fe0000;
    font-size: 40px;
    line-height: 1.3em;
    /* [disabled]font-family: 'Dinpro'; */
}
#contents .tel a {
color: #fe0000;
text-decoration: none;
}

@media only screen and (max-width: 767px){
#contents .tel {
font-size: 30px;
}
}

/* FAX */
#contents .fax {
font-size: 40px;
line-height: 1.3em;
font-family: 'Dinpro';
}
#contents .fax a {
color: #000000;
text-decoration: none;
}

@media only screen and (max-width: 767px){
#contents .fax {
font-size: 30px;
}
}


/* スマホ用メニュー非表示
------------------------------------------------------------*/
@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: 36px;
}
#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: 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,
#contents .col4 {
width: 98%;
margin-right: auto;
margin-left: auto;
text-align: center;
clear: both;
float: none;
}

#contents .col5 {
/*width: 98%;*/
    width: 45%;
text-align: center;
/*margin-right: auto;
margin-left: auto;
clear: both;*/
float: left;
}

.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 table2 {
width: 767px;
white-space: nowrap;
display:block;
}
.scroll table2 tbody{
width: 100%;
display:table;
}
.scroll::-webkit-scrollbar{
height: 5px;
}
.scroll::-webkit-scrollbar-track{
background: #F1F1F1;
}
.scroll::-webkit-scrollbar-thumb{
background: #BCBCBC;
}
.scroll table2 {
width:100%;
}

}

h5.results_black {
    background: #000000;
    padding: 5px;
    width: 100%;
    color: #fff;
    font-size: 18px;
     margin: 5px auto;
}
h5.results_red {
    margin: 5px auto;
    background: #dc0d0d;
    padding: 5px;
    width: 100%;
    color: #fff;
    font-size: 18px;
}

#footbn .fbtel  a {
	color: #fff;
}

#footbn .fbtel  a:visited,
#footbn .fbtel  a:hover{
	color: #fff;
}