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

/*-----------
common
-----------*/

@import url(https://fonts.googleapis.com/earlyaccess/notosansjapanese.css);


html{ font-size: 62.5%;}
body{ font-family:'Noto Sans JP';color:#230000;font-size:1.4rem;/* 14px*/line-height: 1.8;overflow-x: hidden;}
body  {position:relative;}
@media screen and (min-width:960px){body{ font-size:1.6rem;/* 16px*/line-height: 1.6;}}


section {margin:0;padding:0;}
/* floatクリア */
section:before,
section:after {
    content: " ";
    display: table;
}
section:after {
    clear: both;
}
section {
    *zoom: 1;
}



.block {width:90%;margin:0 auto;padding:0;}
.block::after{content: "";display: block;clear: both;}
@media screen and (min-width:960px){
.block {width:98%;max-width:1200px;margin:0 auto;}	
}
/*----幅が狭い---*/
.blocksmall {width:90%;margin:0 auto;padding:0;}
.blocksmall::after{content: "";display: block;clear: both;}
@media screen and (min-width:960px){
.blocksmall {width:98%;max-width:960px;margin:0 auto;}	
}
/*----幅がより狭い---*/
.blockmoresmall {width:90%;margin:0 auto;padding:0;}
.blockmoresmall::after{content: "";display: block;clear: both;}
@media screen and (min-width:769px){
.blockmoresmall {width:98%;max-width:768px;margin:0 auto;}	
}
/*----幅がひろい---*/
.blockwide {width:90%;margin:0 auto;padding:0;}
.blockwide::after{content: "";display: block;clear: both;}
@media screen and (min-width:960px){
.blockwide {width:98%;max-width:1600px;margin:0 auto;}	
}

img {width:100%;}	

/*-----sp pc-------*/
.sp {display:block;}
.pc {display:none;}
@media screen and (min-width:767px){
.sp {display:none;}
.pc {display:block;}
}

/*-----マージン-------*/
.mb05 {margin-bottom:5px;}
.mb10 {margin-bottom:10px;}
.mb20 {margin-bottom:20px;}
.mb30 {margin-bottom:30px;}
.mb40 {margin-bottom:40px;}
.mt-30 {margin-top:-30px;}


/*-----見出し-------*/
h4 {font-size:2.2rem;font-weight:bold;margin-bottom:10px;line-height: 1.4;}
/*iPad*/
@media screen and (min-width: 481px) and (max-width: 768px) {
h4 {line-height: 1.6;}
}
/*PC*/
@media screen and (min-width:769px){
h4 {line-height: 1.6;}
}

/*-----注意-------*/
.cautionwhite {background:#fff;padding:10px;}

/*-----リンク-------*/
a {color:#892828;
	-webkit-transition: opacity 0.5s ease-out;
	-moz-transition: opacity 0.5s ease-out;
	-ms-transition: opacity 0.5s ease-out;
	transition: opacity 0.5s ease-out;}
a:hover {color:#892828;text-decoration: underline;}

.linkgreen {background:#00821e;}
.linkbrown {background:#230000;}
.linkyellow {background:#deb200;}
.linkgreen a,.linkbrown a, .linkyellow a {color:#fff;display: block;width: 100%;text-align:center;padding:10px;}

.linkbtn {text-align: center!important;margin-bottom:40px; }
.linkbtn a {border:2px solid #230000;padding:15px 20px;font-family:  'Noto Sans JP';text-align: center;font-weight:bold;font-size:1.5rem;display:inline-block;background:#fff;color:#230000;}
.linkbtn a  {
    -webkit-transition: all 0.4s ease;
    -moz-transition: all 0.4s ease;
    -o-transition: all 0.4s ease;
    transition: all  0.4s ease;
    }

.linkbtn a:hover {
    background-color: #230000;
	color:#fff;
    }

/* 青線削除 */
*:focus {
outline: none;
}

/* 下矢印  TOP共通で使用 */
.init-bottom:after {
    content: '';
    display: inline-block;
    width: 6px;
    height: 6px;
    margin: 0 0 0 15px;
    border-right: 1px solid #000;
    border-bottom: 1px solid #000;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
}

/* 表組 */
.listTable {width:100%;text-align: center;border:1px solid #999;margin:10px 0;}
.listTable th{padding:1em 0.5em;border-bottom:1px solid #999;}
.listTable td{padding:1em 0.5em;border-bottom:1px solid #999;border-left:1px solid #999;}

#holidayArea{text-align:center; margin-bottom:50px;}
#holidayArea .block{text-align:center;}

/*-------------------------スクロールしてフェードイン-------------------------*/
.fadein {
  opacity: 0;
  transform : translate(0, 50px);
  transition : all 1500ms;
}

.fadein.scrollin{
  opacity: 1;
  transform: translate(0, 0);
}

/*--------------------------右お問い合わせボタン（固定）-------------------------*/


#contactlist {
    display: none;
    position: fixed;
    bottom:0;
    z-index: 100;
    width:100%;
}

#contactlist ul {width:100%;font-size:0;}
#contactlist li {display:inline-block;font-size:1.4rem;text-align:center;}

#contactlist li:nth-child(1)  {background:#00821e;width:33%;}
#contactlist li:nth-child(2)  {background:#230000;width:34%;}
#contactlist li:nth-child(3)  {background:#deb200;width:33%;}
#contactlist li a {color:#fff;display: block;padding:20px 0;}


@media screen and (min-width:768px){
#contactlist {
    top:25vh;
    right:0;
    width:50px;
}
	
#contactlist ul {width:50px;font-size:0;background:#000;}
#contactlist li {
    -ms-writing-mode: tb-rl;
    writing-mode: vertical-rl;
    display:block;
    font-size:1.4rem;
    text-align:center;
}

#contactlist li:nth-child(1)  {background:#00821e;width:100%;}
#contactlist li:nth-child(2)  {background:#230000;width:100%;}
#contactlist li:nth-child(3)  {background:#deb200;width:100%;}
#contactlist li a {color:#fff;display: block;height:140px;text-align: center;width:50px;padding-right:13px;}
}


/*--------------------------------------------------トピック------------------------------------------------------*/
/*ボックスリスト*/
.boxList>li{position:relative; display:inline-block; margin:20px 20px 30px; padding:0; vertical-align:top; text-align:center; transition: .2s; width:300px; background:#fff;}
.boxList>li a{color:#000;display:block;}
.boxList>li .image img{width:100%;}
.boxList>li:hover{-webkit-transform: scale(1.03); -moz-transform: scale(1.03); -ms-transform: scale(1.03); -o-transform: scale(1.03);box-shadow: 0px 3px 15px rgba(0,0,0,0.4);}

/*トピック*/
.headline{font-size:220%; letter-spacing:0.2em ;line-height:160%; margin:10px auto 20px; font-weight:400;}
.heading{font-size:160%; font-weight:600; line-height:160%;}

#topicArea{background-image: radial-gradient(rgb(253 242 170 / 1) 6%, transparent 8%), radial-gradient(rgb(253 242 170 / 1) 10%, transparent 14%);background-position: 0px 0px, 36px 36px; background-size: 72px 72px; background-color: rgb(255 255 255 / 0;); text-align:center; padding:0 0 50px; margin-bottom:50px;}
#topicArea .boxList>li {width:400px; padding:10px 10px 30px; background:#000; font-family:"Roboto Slab",'Noto Sans JP'; gap:30px;}
#topicArea .boxList>li a{color:#fff; font-weight:400; text-decoration:none;}
#topicArea .boxList>li a h3.heading{color:#fff; font-weight:400; letter-spacing:0.2em; margin:20px 0;}
#topicArea .boxList>li article{text-align: left; line-height:150%; font-size:90%; margin:0 5% 20px;}
@media(max-width:640px ){
#topicArea .boxList{flex-direction:column; animation:none;}
#topicArea .boxList:nth-of-type(2){display:none;}
#topicArea .boxList li{ width:90%; margin:30px auto 0;}
}


/*--------------------------------------------------お知らせとFB------------------------------------------------------*/
#snsarea {padding:0px 0 50px 0;position:relative;margin-top:120px;}
#snsarea:before{
	position:absolute;
	left:20%;
	content:"";
	display:inline-block;
	width:200px;
	height:300px;
	background:url("../images/top/bg_midashi.png")no-repeat;
	background-size:contain;
	margin-top:-100px;
}
/*iPad*/
@media screen and (min-width: 481px) and (max-width: 810px) {
#snsarea:before{left:35%;}
}
/*PC*/
@media screen and (min-width:811px){
#snsarea:before{left:45%;}
}

/*SP*/
.newsArea {margin-bottom:40px;}
.newsArea h3{font-weight:bold;font-size:2rem;margin-bottom:10px;}
.newsArea dl{margin-bottom:30px;}
/*iPad*/
@media screen and (min-width: 481px) and (max-width: 810px) {
.newsArea {width: 300px;float:left;margin-right:10px;}
.newsArea dl{margin-bottom:40px;}
.newsArea dt {font-weight:bold;}
.newsArea dd {margin-bottom:10px;}
.fb-page	{float:right;}
}
/*PC*/
@media screen and (min-width:811px){
.newsArea {width: 450px;float:left;margin-right:50px;}
.newsArea dl{margin-bottom:40px;}
.newsArea dt {font-weight:bold;}
.newsArea dd {margin-bottom:10px;}
.fb-page	{float:right;}
}


/*---------------------------------------------------スライダー--------------------------------------------------------------*/
ul.slick2 {margin-bottom:20px;}

/*---------------------------------------------------表示・非表示--------------------------------------------------------------*/
.timerShowHide{display: none;}
.timerVisible{ display: block;}

/*---------------------------------------------------footer　あさぶん--------------------------------------------------------------*/
/*SP*/
#footerab {padding:40px 0;background:#e9e1d1;}
.ftlogo {width:50%;margin:0 auto 20px auto;}
ul.ftabnavi {font-size: 0;}
ul.ftabnavi>li{font-size: 1.4rem;width:50%;display:inline-block;margin-bottom:10px;vertical-align: top;}
ul.ftabsns{width:250px;margin:20px auto;text-align:center;}
ul.ftabsns>li{display:inline-block;margin:0 5px;}
#footerab a{color:#230000!important;}
#footerab .linkgreen a {color:#fff!important;}
#footerab .linkbrown a {color:#fff!important;}
/*iPad*/
@media screen and (min-width: 481px) and (max-width: 768px) {
.ftlogo {width:20%;margin:0 auto 20px auto;}	
ul.ftabnavi>li{width:25%;}
}

/*PC*/
@media screen and (min-width:769px){
.ftlogo {width:15%;float:left;margin-right:5%;}
ul.ftabnavi {width:80%;float:left;}
ul.ftabnavi>li{width:25%;}
}


/*---------------------------------------------------footer　きたもっく--------------------------------------------------------------*/
/*SP*/
#footerkm {background: #230000;text-align: center;padding:20px 0;color:#fff;font-size:1.3rem;}
#footerkm .ftkmlogo{width:10%;margin:0 auto 10px auto;}
#footerkm .ftkmlogo img{width:100%;}
#footerkm .ftkmname{font-weight:bold;text-align:center;margin-bottom:10%;}
#footerkm ul{margin:5% 0;font-size: 0;width:100%;}
#footerkm ul li{display:inline-block;width:22%;margin:0 4% 10% 0;vertical-align:center;}
#footerkm ul li:nth-child(4){margin-right:0%;}
#footerkm ul li a{color:#230000!important;}
/*iPad*/
@media screen and (min-width: 481px) and (max-width: 768px) {
#footerkm .ftkmlogo{width:8%;float:left;margin:0 7% 0 0;}
#footerkm .ftkmname{text-align:left;width:85%;float:left;margin-bottom:10%;}
#footerkm .ftkmlogoArea{ width:70%; float:left; margin-right:2%;margin-top:10px;}
#footerkm ul{margin:0;font-size: 0;width:28%;float:right;}
#footerkm ul li{width:48%;margin:0 4% 10% 0;vertical-align:center;}	
#footerkm ul li:nth-child(2){margin-right:0%;}
}
/*PC*/
@media screen and (min-width:769px){
#footerkm .ftkmlogo{width:8%;float:left;margin:0 5% 0 0;}
#footerkm .ftkmname{text-align:left;width:87%;float:left;margin-bottom:10%;}
#footerkm .ftkmlogoArea{ width:57%; float:left; margin-right:3%;margin-top:10px;}
#footerkm ul{margin:2% 0;font-size: 0;width:40%;float:right;}
#footerkm ul li{width:20%;margin:0 6% 10% 0;vertical-align:center;}	
}

