@charset "UTF-8";
/* CSS Document */

/*メディアクエリ用記法*/
@media (min-width: 320px) {
}
@media (min-width: 360px) {
}
@media (min-width: 374px) {
}
@media (min-width: 414px) {
}
@media (min-width: 480px) {
}
@media (min-width: 600px) {
}
@media (min-width: 768px) {
}
@media (min-width: 980px) {
}

/*CSSをリセットする*/
html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
    margin:0;
    padding:0;
}

/*フォント指定*/
@font-face {
font-family: 'MPLUSRounded1c';
  src: url('../font/MPLUSRounded1c-Bold.ttf') format('truetype');
font-weight: 700;
    font-style: bold;
}
@font-face {
font-family: 'MPLUSRounded1c';
  src: url('../font/MPLUSRounded1c-Regular.ttf') format('truetype');
font-weight: 400;
    font-style: normal;
}
/*rem用文字サイズ*/
html {font-size: 75%;}
@media (min-width: 980px) {
html {font-size: 62.5%;}
}

body{font-family:MPLUSRounded1c, "游ゴシック", "Yu Gothic", YuGothic,'Lucida Grande', 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', Meiryo, メイリオ, sans-serif;-webkit-text-size-adjust: 100%;background-color:rgba(255,255,255,1);}

header,footer,main,nav,article,section{display:block;}/*IE用指定*/

img{border:none;}
/*clearfix*/
.clearfix:after {
  content: ""; 
  display: block; 
  clear: both;
}

/*小細工用*/
.spbr{display:inline;}
.pcbr{display:none;}
.txtright{text-align:right;}
.anchor_position{position:relative;top:-80px;}
@media (min-width: 980px) {
.spbr{display:none;}
.pcbr{display:inline;}
}

.inner{box-sizing:border-box;}



header{position:relative;left:0px;top:0px;background-color:rgba(255,255,255,0.9);box-shadow: 0px 3px 8px 0px rgba(0,0,0,0.3);width:100%;height:auto;z-index:10000;}
header .inner{max-width:1200px;margin:0px auto;position:relative;height:60px;}
header h1{padding:10px 16px 2px;}
header h1 img{width:200px;height:35px;}

.headimg{background-image:url(../images/visual.jpg);background-size:100% auto;height:180px;}
.headimg img#visualimg{width:100%;height:auto;max-width:1200px;position:relative;}
.headimg p{text-align:center;}
.headimg p img{width:240px;height:auto;}
.headimg h2{text-align:center;}
.headimg h2 img{width:200px;height:auto;}
.headimg div.buttonarea{text-align:center;}

nav{position:fixed;background-color:rgba(240,240,240,0.7);right:-320px;top:0px;width:320px;height:100vh;color:rgba(0,0,0,1);overflow:auto;z-index:10000;transition:right 0.3s linear;}
nav.opennav{right:0px;}

.btn,
a.btn,
button.btn {
  font-size: 1.2rem;
  font-weight: 400;
  line-height: 1.2;
  position: relative;
  display: inline-block;margin:0.2rem;
  padding: 0.4rem 2rem;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
  text-align: center;
  vertical-align: middle;
  text-decoration: none;
  letter-spacing: 0.1em;
  color: #212529;
  border-radius: 0.5rem;
}
.btn--orange,
a.btn--orange {
  color: #fff;
  background-color: #eb6100;
}
.btn--orange:hover,
a.btn--orange:hover {
  color: #fff;
  background: #f56500;
}

a.btn--radius {
   border-radius: 100vh;
}
@media (min-width: 427px) {
.headimg{height:240px;}
.headimg p{padding:20px 0px;}
.headimg h2{padding:0px 0px 30px;}
}
@media (min-width: 768px) {
.headimg{height:400px;}
.headimg p{padding:40px 0px;}
.headimg p img{width:380px;height:auto;}
.headimg h2{padding:0px 0px 50px;}
.headimg h2 img{width:360px;height:auto;}


}
@media (min-width: 980px) {
.headimg{height:570px;}
.headimg p{padding:130px 0px 40px;}
.headimg p img{width:580px;height:auto;}
.headimg h2{padding:0px 0px 66px;}
.btn,
a.btn,
button.btn {
  font-size: 1.5rem;
  font-weight: 400;
  line-height: 1.2;
  position: relative;
  display: inline-block;margin:0.2rem;
  padding: 0.4rem 2rem;
}
}


main{margin-left:auto;margin-right:auto;padding:10px;background-color:#F9E9BC;}
main .inner{max-width:1200px;margin:0px auto;}


main h3{font-size:2.0rem;text-align:center;margin:3.0rem 0 0;color:#9a7607;padding-bottom:56px;}
.h3kokoga{background-image:url(../images/yajirushi.svg);background-repeat:no-repeat;background-position:center;background-size:40px auto;}
.h3okyakusama{background-image:url(../images/voice.svg);background-repeat:no-repeat;background-position:center;background-size:50px auto;}

article.kokoga{}

.sectionwaku{}
article.kokoga section{border-radius:20px;border:3px solid #9a7607;background-color:#FFe;margin:0px 0px 20px;}
article.kokoga section h4 {margin:10px 20px 10px;font-size:1.6rem;color:#F60;}
article.kokoga section p {margin:10px 20px 20px;line-height:2.0rem;font-size:1.4rem;}
article.kokoga section .sectionimgbox {text-align:center;margin:20px 20px 10px;}
article.kokoga section .sectionimgbox img {width:100%;height:auto;max-width:600px;}

article.okyakusama{}
article.okyakusama section{border-radius:0px;border:1px solid #cccccc;background-color:rgba(244,244,244,0.8);margin:0px 0px 20px;}
article.okyakusama section p{margin:20px 20px 20px;line-height:2.0rem;font-size:1.4rem;line-height:1.8rem;}

@media (min-width: 980px) {
main h3{font-size:2.6rem;text-align:center;margin:3.0rem 0 0;color:#9a7607;padding-bottom:56px;}
.sectionwaku{display:flex;max-width:1100px;margin:0px auto;}
article.kokoga section{margin:0px 10px 20px;width:calc(100% / 3 - 20px);}
article.kokoga section h4 {font-size:1.9rem;}
article.kokoga section p {line-height:2.6rem;font-size:1.6rem;}

article.okyakusama section{margin:0px 10px 20px;width:calc(100% / 3 - 20px);display: -webkit-box;
  display: -ms-flexbox;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;}
article.okyakusama section p{font-size:1.6rem;line-height:2.4rem;}

}




/*フッタ*/
footer{margin-left:auto;margin-right:auto;width:100%;z-index:2;border-top:1px solid rgba(155,155,155,1);background-color:#ff6600;background-image:url(../images/footer.png);background-size:cover;}
footer .inner{max-width:1200px;margin:0px auto;padding:20px;position:relative;text-align:center;}

footer h5{font-size:1.6rem;line-height:2.4rem;margin:0px 0px 10px;color:#ffffff;}
footer button{border-radius:30px;border:3px solid #ffffff;padding:20px;background-color:#FF4211;color:#fff;font-size:2.4rem;line-height:2.4rem;cursor:pointer;box-shadow:5px 5px 10px rgba(0,0,0,0.6);font-family:MPLUSRounded1c;}
@media (min-width: 768px) {
.footmenu>li{width:20%;}
}
@media (min-width: 980px) {
footer p{position:absolute;right:10px;top:22px;text-align:right;}
}



/*ページトップボタン*/
.button_pagetop{width:50px;height:50px;position:fixed;right:20px;bottom:20px;background-color:rgba(0,0,0,0.7);}
.button_pagetop a{position:relative;display:block;width:50px;height:50px;text-decoration:none;}
.button_pagetop a::before{content:"";width:0;height:0;position:absolute;margin:auto;top:-25px;right:0;left:0;bottom:0;border:12px solid transparent;border-bottom:13px solid rgba(255,255,255,1);}
.button_pagetop a::after{content:"TOP";font-size:13px;position:absolute;top:30px;bottom:0px;right:0;left:0;text-align:center;margin:auto;color:rgba(255,255,255,1);}


/*トップページ*/

.visual_index{background-color:rgba(0,0,0,0.6);text-align:center;}
.visual_index img{width:100%;height:240px;max-width:1200px;object-fit:cover;vertical-align:bottom;}

.indexmain .news {margin:0px auto;max-width:500px;padding-bottom:30px;}
.indexmain .news h2{text-align:center;font-size:2.4rem;margin:60px 0px 30px;}
.indexmain .news h3{font-size:1.3rem;margin:10px;font-weight:normal;padding-right:20px;position:relative;}
.indexmain .news h3::after{content:"";width:0;height:0;position:absolute;top:50%;margin-top:-3px;right:0;border:6px solid transparent;border-top:7px solid rgba(0,0,0,1);}
.indexmain .news>div{border:1px solid rgba(100,100,100,1);margin:10px;padding:10px;display:none;}
.indexmain .news>div p{font-size:1.2rem;}


.service_index{background-color:rgba(227,227,227,1);text-align:center;padding-top:20px;margin-bottom:40px;}
.service_index .inner{max-width:1200px;margin:0px auto;}
.service_index figure{padding:0px 20px 20px 20px;max-width:400px;margin:0px auto;}
.service_index figure img{width:100%;height:auto;max-width:400px;}
.service_index figure figcaption{text-align:left;}
.service_index figure figcaption h4{font-size:1.6rem;padding:10px 0px;text-align:center;}
.service_index figure figcaption p{font-size:1.4rem;}
@media (min-width: 768px) {
.visual_index img{height:476px;}
.service_index{}
.service_index .inner{max-width:1200px;margin:0px auto;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;}
.service_index figure{max-width:270px;}
}