@charset "utf-8";
@import url('https://fonts.googleapis.com/css?family=Noto+Sans+JP:400,500,600,700,800');


/* ===================================================
 Reset
=====================================================*/
html {overflow-y: scroll;}
div, dl, dt, dd, ul, ul li, h1, h2, h3, h4, h5, h6,
pre, form, fieldset, input, textarea, p, blockquote, th, td,
section, nav, article, aside, hgroup, header, address,
figure, figcaption, ul, ol {margin: 0; padding: 0;}
address, caption, cite, code, dfn, em, strong, th, var {font-style: normal; font-weight: normal;}
table{ border-collapse: collapse; border-spacing: 0;}
caption, th {text-align: left;}
q:before ,q:after {content: '';}
object, embed {vertical-align: top;}
hr, legend {display: none;}
h1, h2, h3, h4, h5, h6 {font-size: 100%; font-weight: normal;}
img, abbr, acronym, fieldset {border: 0;}
img {vertical-align: top; -ms-interpolation-mode: bicubic;}
ul li, ol li {list-style-type: none; margin: 0px; padding: 0px;}


/* ===================================================
 common
=====================================================*/
body{
	margin: 0;
	padding: 0;
   }
html {
	font-family: 'Noto Sans JP', sans-serif, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic";
	-webkit-text-size-adjust: 100%;
	-ms-text-size-adjust: 100%;
	font-size: 62.5%;/* 10px */
scroll-behavior: smooth;

}

/* Fluid-img----------------------------------- */
img {max-width : 100%; border: 0}

/* clearfix----------------------------------- */
.clearfix:after {content: ""; display: block; clear: both; visibility: hidden;}

/* 禁則処理の追加----------------------------------- */
p,li,dt,dd,th,td,pre{
-ms-line-break: strict;
line-break: strict;
-ms-word-break: break-strict;
word-break: break-strict}

a {outline: none; color: #464646; transition: all 0.3s;}
a:link {text-decoration: none; color: #464646;}
a:visited {text-decoration: none; color: #464646;}
a:hover {text-decoration: underline; color: #ff9900;}
a:active {text-decoration: none; color: #ff9900;}

/* ===================================================
1025px〜　for PC
=====================================================*/
a[href*="tel:"] {
    pointer-events: none; /*①アンカーのtelを無効化*/
    cursor: default; /*②アンカーのポインターをデフォルトにする*/
    text-decoration: none;
}
html{color:#333333; background-color:#FFFFFF;}
body { font-size: 1.8rem; } /* 18px */
.wrap{width:960px; margin : 0 auto; padding: 100px 0 120px 0}

h2{
color: #000000;
text-align: center;
line-height: 1.6;
margin: 0 auto 50px auto;
font-size: 4.8rem;
font-weight: 700;
}
    
p{margin-bottom: 20px; font-size: 1.8rem; line-height: 2.2}

ul.list{font-size: 2rem; line-height: 1.8}
ul.list li{position: relative; padding-left: 1.3em; text-indent: 0em; margin-bottom: 0.3em}
ul.list li:last-child{margin-bottom: 0}
ul.list li::before{
	content:'';
	width:0.9em;
	height:0.9em;
	border-radius: 50%;
	position:absolute;
	top:0.5em;
	left:0;
	background-color:#000000;
}

#contact.bk_yellow ul.list li{ font-size: 2rem}

/*----------------------------------------------------
header
------------------------------------------------------*/
header{background-color: #ffcc00}
header .inner{
width: 960px;
margin-left: auto;
margin-right: auto;
padding-bottom: 20px;
padding-top: 20px;
}
header img{width: 28%}

/*----------------------------------------------------
mv
------------------------------------------------------*/
#mv{
width: 100%;
    background-color: #000000;
}


#mv .wrap{
width:100%;
    margin : 0 auto;
    padding:0;
    text-align: center;
}



/*----------------------------------------------------
問い合わせ先
------------------------------------------------------*/
.bk_yellow{
background-color: #fff0b2;
background-image: url(../images/bk_arrow_black.svg);
background-position: center top;
background-size: 100px 50px;
background-repeat: no-repeat;
}
.bk_yellow h2{margin-bottom: 0;  color: #FF6600;}
.bk_yellow h3{
color: #ffcc00;
line-height: 1.6;
font-size: 3rem;
font-weight: 700;
margin-bottom: 1em;
text-align: center;
background-color: #000000;
padding: 0.2em;
}

.bk_yellow .box{background-color: #FFFFFF; border-radius: 15px; padding: 30px; box-sizing: border-box}
.bk_yellow .ttl{
    text-align: center;
    font-size: 2.6rem;
    margin-bottom: 0.7em;
    font-weight: 500
}
.bk_yellow .ttl span{color: #FF6600; display: block}
.bk_yellow .inner{display: flex; justify-content: space-between}

.bk_yellow ul{width: 47.5%}
.bk_yellow ul.list li{font-weight: 600; font-size: 2.2rem}
.bk_yellow ul.list2 li{margin-bottom: 0.5em; line-height: 1.6}
.bk_yellow ul.list2 li:last-child{margin-bottom: 0}

.btn_area{
margin-left: auto;
margin-right: auto;
text-align: center; 
margin-top: 50px;
}
.btn_contact{display: inline-block; text-align: center;}
.btn_contact a{
text-align: center; 
font-size: 2.4rem;
font-weight: 500;
color: #FFFFFF;
border-radius: 60px;
-webkit-border-radius: 60px;
-moz-border-radius: 60px;
text-align: center;
position: relative;
transition: all 0.3s;
display:block;
padding:1em 2em 1em 2em;
width: 22em;
box-sizing: border-box;
}

.btn_contact a{background-color: #FF6600; margin-left: 50px}

.btn_contact a::before{
    content: '';
    border: 0px;
    -ms-transform: rotate(135deg);
    -webkit-transform: rotate(135deg);
    transform: rotate(135deg);
    position: absolute;
    top: 40%;
    width: 10px;
    height: 10px;
    border-top: solid 2px #FFF;
    border-right: solid 2px #FFF;
    right: 35px;
}
.btn_contact a:hover{ text-decoration:none; opacity:0.7}


/*----------------------------------------------------
point
------------------------------------------------------*/
.bk_white{background-color: #ffffff;}
.box_container{display: flex; align-items:stretch; justify-content:space-between }
.box_container .box{
box-sizing: border-box;
width: 32%;
background-color: #fff7d9;
border: #ffcc00 3px solid;
border-radius: 15px;
padding-top:0;
padding-right: 2.5%;
padding-left: 2.5%;
padding-bottom: 2.5%;
margin-top: 30px;
}
.bk_white .ttl{font-weight: 700; font-size: 2.4rem; text-align: center; margin-top: -10px; margin-bottom: 0.5em}

.point {
  width: 100px;
  height: 100px;
  border-radius: 50%;
  background-color: #ffcc00;
  position: relative; /* 子要素の基準点 */
  left: 50%;
  transform: translate(-50%, -30px);
    color: #000000;
}

.tpoint-container {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  text-align: center;
  width: 100%; /* 親要素の幅に合わせる */
  box-sizing: border-box;
  line-height:1;
}
.tpoint-container span{font-weight: 800; font-size:250%; display: block}

/*----------------------------------------------------
概要
------------------------------------------------------*/
.bk_gray{background-color: #f0f0f0;}
.bk_gray h2{
text-align: left;
line-height: 1.6;
margin: 0 auto 0.5em auto;
font-size: 3.6rem;
float: left;
}
.bk_gray ul.list{font-weight: 600; margin-bottom: 0.6em; font-size: 2rem}
.bk_gray ul.list .biko{font-weight: normal; display: block; font-size: 1.8rem;}
.bk_gray ul.list .kome{font-size: 1.4rem; font-weight: normal; display: block}

.dw{float: right; font-size: 1.6rem}
.dw a{background-color: #000000; color: #ffcc00; border-radius: 6px; padding: 0.6em 0.8em; display: inline-block}
.dw a span{
display: inline-block;
background-repeat: no-repeat;
background-size: 20px 24px;
background-image: url(../images/icon_pdf.svg);
background-position: right center;
padding-right: 28px;
}
.dw a:hover{text-decoration: none; opacity: .7}

/*----------------------------------------------------
contact
------------------------------------------------------*/



/*----------------------------------------------------
footer
------------------------------------------------------*/
#footer{background:#d6d6d6; margin-right: auto; margin-left: auto; width: 100%;}
#footer #f_top{background:#424242; margin-right: auto; margin-left: auto; width: 100%; padding:8px 0px 8px 0px; color:#FFFFFF; font-size:139%; font-weight:bold;}
#footer #f_top span{font-size:80%; }

#footer #f_top div, #footer #f_mid, #footer #f_bot{margin-right: auto; margin-left: auto; width: 960px; }

#footer #f_mid{padding-top:15px; padding-bottom:15px; font-size:93%;}
#footer #f_mid ul{float: left; margin-right:50px;}
#footer #f_mid li a{line-height:180%;}
#footer #f_mid:after {content: ""; display: block; clear: both; visibility: hidden;}

#footer #f_bot{
	padding-top: 10px;
	padding-bottom: 10px;
	border-top: 1px solid #FFFFFF;
	font-size:85%;
	line-height:160%;
}
#footer #f_bot:after {content: ""; display: block; clear: both; visibility: hidden;}
#footer #f_bot div#chu{float: left;}
#footer #f_bot div#chu span{display: block}
#footer #f_bot div#copyright{float: right;}



/*----------------------------------------------------
toPageTopの設定
----------------------------------------------------*/
#toPageTop {
	position: fixed;
	bottom: 100px;
	right: 10%;
}
#toPageTop a {
display: block;
width: 82px;
height: 82px;
background-image: url(../images/pagetop.png);
background-repeat: no-repeat;
background-size: 82px 82px;
}
#toPageTop img{width: 82px; height: 82px;}
#toPageTop a:hover{opacity: .7}

/* ===============================================================================================
1024px for tablet
=================================================================================================*/
@media screen and (max-width : 1024px) {
body { font-size: 1.6rem; } /* 16px */
.wrap{width:100%; box-sizing: border-box; padding: 80px 4%}
header .inner{width: 100%; box-sizing: border-box; padding: 20px 4%;}
#footer #f_top div, #footer #f_mid, #footer #f_bot{width: 100%; box-sizing: border-box; padding-left:4%; padding-right:4%;}

h2{font-size: 3.5rem;}

#contact.bk_yellow ul.list li{ font-size: 1.7rem}
    
#mv .wrap{box-sizing: border-box; padding:0 4%}
    


/*----------------------------------------------------
問い合わせ先
------------------------------------------------------*/
.bk_yellow ul.list2{font-size: 1.4rem}
.bk_yellow h3{font-size: 2.4rem;}  
.bk_yellow{background-size: 80px 40px;}  
.bk_yellow ul.list li{font-size: 1.7rem}

/*----------------------------------------------------
point
------------------------------------------------------*/
.box_container .box{border: #ffcc00 2px solid; margin-top: 20px;}
.bk_white .ttl{font-size: 1.8rem;}
.box_container ul.list{font-size: 1.4rem;}
    
/*----------------------------------------------------
概要
------------------------------------------------------*/
.bk_gray h2{font-size: 3rem;}
.bk_gray ul.list{font-size: 1.6rem}
.bk_gray ul.list .biko{font-size: 1.4rem}
.bk_gray ul.list .kome{font-size: 1.1rem;}
.dw{font-size: 1.4rem}
.dw a{padding: 0.8em 0.7em}
.dw a span{background-size: 18px 21px;}
    
}

/* ===============================================================================================
767px for SP
=================================================================================================*/
@media screen and (max-width : 767px) {
a[href*="tel:"] {
    pointer-events: auto; /*①アンカーのtelを無効化*/
    cursor: pointer; /*②アンカーのポインターをデフォルトにする*/
    text-decoration: underline;
}
    
body { font-size: 1.4rem; } /* 14px */
.wrap{width: 100%; box-sizing: border-box; padding: 60px 5%}
span.pre{display: block}

h2{margin: 0 auto 30px auto; font-size: 2.8rem;}
h2 span.none{display: none}
   
p{margin-bottom: 20px; font-size: 1.4rem;}

ul.list{font-size: 1.4rem;margin-bottom: 1.2em}
    
#contact.bk_yellow ul.list li{ font-size: 1.6rem}

/*----------------------------------------------------
header
------------------------------------------------------*/
header{width: 100%; text-align: center;}
header img{width: 40%}
header .inner{padding: 10px 0;width: 100%;}

/*----------------------------------------------------
footer
------------------------------------------------------*/
#footer{margin-top: 0px;}
#footer #f_top{width: 100%; font-size:1.4rem; text-align: center}
#footer #f_top span{font-size:1.2rem; }

#footer #f_top div, #footer #f_mid, #footer #f_bot{margin-right: auto; margin-left: auto; width: 100%; padding:0;}

#footer #f_mid{padding-top:0px; padding-bottom:0px; font-size:1.4rem;}
#footer #f_mid ul{display: inline-block; margin-right:0px; width: 100%; font-size: 0; vertical-align: top}
#footer #f_mid ul li{
border-left: 1px none #FFFFFF;
border-right: 1px solid #FFFFFF;
border-bottom: 1px solid #FFFFFF;
border-top: 1px none #FFFFFF;
display: inline-block;
width: 50%;
box-sizing: border-box;
font-size: 1.4rem;
padding: 0.8em 0.8em 0.8em 1em;
}
#footer #f_mid ul li:nth-child(2){border-right: 1px none #FFFFFF;}

#footer #f_bot{
	padding: 10px;
    box-sizing: border-box;
	font-size:1.1rem;
	line-height:160%;
    border: none;
}
#footer #f_bot div#chu{float: none; }
#footer #f_bot div#chu span{display: inline}
#footer #f_bot div#copyright{float: none; text-align: center; margin-top: 10px;}


/*----------------------------------------------------
toPageTopの設定
----------------------------------------------------*/
#toPageTop {
	bottom: 40px;
	right: 3%;
}
#toPageTop a {
	width: 60px;
	height: 60px;
	background-size: 60px 60px;
}

#toPageTop img{width: 60px; height: 60px;}

/*----------------------------------------------------
mv
------------------------------------------------------*/


/*----------------------------------------------------
問い合わせ先
------------------------------------------------------*/
.bk_yellow .box{padding: 15px;}
.bk_yellow .ttl{
    font-size: 1.6rem;
    margin-top: 10px;
}
.bk_yellow .inner{display: block;}
.bk_yellow ul{width: 100%}
.bk_yellow{background-size: 60px 30px;}
.bk_yellow h3{font-size: 2rem; padding:0.3em 0.5em}
    
.btn_area{margin-top: 0px;}
.btn_contact{display:block;}
.btn_contact a{
font-size: 1.6rem;
padding:1em 2.5em 1em 1em;
width: 100%;
display: inline-block;
}

.btn_contact a{margin-top: 30px; margin-left: 0px}

.btn_contact a::before{
    top:38%;
    width: 8px;
    height: 8px;
    right: 20px;
}


    

/*----------------------------------------------------
point
------------------------------------------------------*/
.bk_white ul.list li{font-size: 1.8rem}
.box_container{display:block;}
.box_container .box{
width: 100%;
border: #ffcc00 2px solid;
padding-right: 8%;
padding-left: 8%;
padding-bottom: 8%;
margin-top: 50px;
}
.bk_white .ttl{margin-top: -15px;font-size: 2.6rem}

.point {
  width: 80px;
  height: 80px;
  transform: translate(-50%, -30px);
}

/*----------------------------------------------------
概要
------------------------------------------------------*/
.bk_gray h2{font-size: 2.4rem; float: none}
.bk_gray ul.list{font-size: 1.6rem}
.bk_gray ul.list .biko{font-size: 1.3rem}
.bk_gray ul.list .kome{font-size: 1rem;}
.dw{float: none; margin-bottom: 1.5em}

/*----------------------------------------------------
contact
------------------------------------------------------*/



}