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

/*
Theme Name: kakifes
Description: Habakiri の子テーマです ( テーマの説明 )
Author: AZLinks ( 作者名 )
Version: 1.0.0
License: GNU General Public License
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Template: habakiri
*/

@media (min-width: 1200px){
.container {
    width: 1370px;
}
}

/* ヘッダー部分装飾　*/
body {
    font-family: Helvetica Neue,Helvetica,Arial,sans-serif;
    font-size: 16px;
    line-height: 1.9;
    color: #333;
    background-color: #fff;
}
/*
img:hover {
opacity: 0.6;
filter: alpha(opacity=60);
-moz-opacity:0.6;
}*/

video{
	width: 100%;
}
.header {
  /*  background-image: url(img/header-border.jpg);*/
}
.header-contents {
	text-align: center;
}

.habakiri-slider__item-content {
    color: #fff;
    position: absolute;
    left: 0;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    text-align: center;
    font-size: 30px;
    font-weight: bold;
	text-shadow: -1px -2px 3px #808080;
}

.head-logo{
	margin-left: 10%;
	max-width: 50%;
	margin-bottom: 10px;
	margin-top: 10px;
}

/*SP表示*/
@media (max-width: 767px) {
	.head-logo{
	margin: 0 auto;
	max-width: 50%;
	margin-bottom: 10px;
	margin-top: 10px;
}
}


/*メニュー装飾*/
/*menu*/
.menu{
    height: 20px;
    position: absolute;
    right: 20px;
    top: 20px;
    width: 30px;
    z-index: 999;
}
.menu__line{
    background: #000;
    display: block;
    height: 2px;
    position: absolute;
    transition:transform .3s;
    width: 100%;
}
.menu__line--center{
    top: 9px;
}
.menu__line--bottom{
    bottom: 0;
}
.menu__line--top.active{
    top: 8px;
    transform: rotate(45deg);
}
.menu__line--center.active{
    transform:scaleX(0);
}
.menu__line--bottom.active{
    bottom: 10px;
    transform: rotate(135deg);
}
/*gnav*/
.gnav{
    background: rgba(0,0,0,0.8);
    display: none;
    height: 100%;
    position: fixed;
    width: 100%;
    z-index: 98;
}
.gnav__wrap{
    align-items:center;
    display: flex;
    height: 100%;
    position: absolute;
    width: 100%;
	line-height: 0.8;
}
.gnav__menu{
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    width: 600px;

}
.gnav__menu__item{
    margin: 20px 0 40px 100px;
    opacity: 0;
}
.gnav__menu__item a{
    color: #fff;
    font-size: 2.5em;
    font-weight: bold;
    text-decoration: none;
    transition: .5s;
}
.gnav__menu__item a:hover{
    color: #666;
}

.menu-desc{
	font-size: 0.5em;
	color:#CACACA;
}
/*SP表示*/
@media (max-width: 767px) {
.gnav__menu{
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    width: 400px;
}
.menu-br{
		padding: 0px;
	}
.gnav__menu__item{
    margin: 20px 0 30px 100px;
    opacity: 0;
}
.gnav__menu__item a{
    color: #fff;
    font-size: 2.0em;
    font-weight: bold;
    text-decoration: none;
    transition: .5s;
}
}

/* メインコンテンツ部分装飾　*/

.top-concept{
	text-align: center;
	margin-bottom: 30px;
}
	
.top-concept-text{
	text-align: center;
	margin-bottom: 30px;
	padding: 0 10%;
	font-weight: bold;
	font-size: 0.9em;
}
	

.title-cont-top {
    text-align: center;
    margin: 10px 0 20px;
	clear: both;
}

.title-cont {
    text-align: center;
    margin: 60px 0 20px;
	clear: both;
}


.top-cont-bnr{
	    margin: 10px 0;
}

.cont01--top-main{
	margin-top: 30px;
    padding: 30px 0;
    background-image: url(img/header-top-bg.jpg);	
}

.cont02--top-main{
    padding: 60px 0 30px;
    background-image: url(img/bg-paper.jpg);	
}

.cont03--top-main{
    padding: 20px 0;
    background-image: url(img/bg-paper.jpg);	
}


.cont01--content-achool{
    padding: 20px 0;
	color: #fff;
	background: #e52d3d;
	text-align: center;
	font-size: 
}

.cont01--content-achool h2{
	font-size: 22px;
}

.cont02--content-achool{
    padding: 20px 0;
}
.cont02--content-gakusyu{
    padding: 20px 0;
}

.content-title h2{
	text-align: center;
	font-size: 34px;
	color: #72CBDF;
    margin: 60px 0 40px;
	font-weight: 900;
}

.content-title h3{
	text-align: center;
}

.content-title h4{
	text-align: center;
}


.teach-desc{
	font-size:  10px;
	line-height:1.4 ;
}

.teach-desc p{
	margin: 0;	
}

.teach-desc hr{
	margin: 5px 0;
	border-top:  1px dashed #8c8b8b;
}

.cont03--content-contactbox{
	background-color: #c8bb9b;
	color: #fff;
	text-align: center;
	padding: 40px 10px;
	margin: 40px 0; 
	
}

.cont04news--top-main{
	background: #c4f5f7;
	
}

h3 {
    background-image: url(img/bg_h2.png);
    background-repeat: no-repeat;
    /* background-position: 10% center; */
    background-size: contain;
    /* text-align: center; */
    padding-left: 65px;
    line-height: 80px;
}


/*　メインコンテンツ画像PC/SP切り替え　*/

/*SP表示*/
@media (max-width: 767px) {
	.hidden-xs{
		display: none;
	}
	.hidden-sm{
		display: none;
	}
	
/*	ボタン*/
	.btn-contact-lrg{
	color: #fff;
    background-color: #e73743;
    border-color: #e73743;
    font-size: 18px;
	font-weight: 600;
    padding: 20px 0;
    width: 90%;
    margin: 0 auto;
}
	
/*各ページヘッダー部分*/
	.header-contents{
		display: none;
	}
	
}
/*PC表示*/
@media (min-width: 768px) {
	.hidden-md{
		display: none;
	}
	.hidden-lg{
		display: none;
	}
	
	/*	ボタン*/
	.btn-contact-lrg{
	color: #fff;
    background-color: #e73743;
    border-color: #e73743;
    font-size: x-large;
	font-weight: 600;
    padding: 20px 0;
    width: 60%;
    margin: 0 auto;
}	
	
	
/*各ページヘッダー部分*/
	.header-contents-sp{
		display: none;
	}
}


/* コンテンツボタン */

	.btn-content-green{
	color: #fff;
    background-color: #7fcac3;
    border-color: #7fcac3;
    font-size: 18px;
	font-weight: 600;
    padding: 20px 0;
    width: 100%;
    margin: 0 auto;
}
	.btn-content-red{
	color: #fff;
    background-color: #e73743;
    border-color: #e73743;
    font-size: 18px;
	font-weight: 600;
    padding: 20px 0;
    width: 100%;
    margin: 0 auto;
}
	.btn-content-purple{
	color: #fff;
    background-color: #9475cc;
    border-color: #9475cc;
    font-size: 18px;
	font-weight: 600;
    padding: 20px 0;
    width: 100%;
    margin: 0 auto;
}
	.btn-content-orange{
	color: #fff;
    background-color: #ffb74e;
    border-color: #ffb74e;
    font-size: 18px;
	font-weight: 600;
    padding: 20px 0;
    width: 100%;
    margin: 0 auto;
}
	.btn-content-blue{
	color: #fff;
    background-color: #1a76d2;
    border-color: #1a76d2;
    font-size: 18px;
	font-weight: 600;
    padding: 20px 0;
    width: 100%;
    margin: 0 auto;
}




/*トップページ新着情報*/

.top-news{
	margin-bottom: 40px;
}
.top-news ul{
    padding-inline-start: 0px;
	padding-left:0px;
}

#npcatch li {
	display: inline-block;
	margin: 0;
	overflow: hidden;
	clear: both;
	vertical-align: top;
	max-width: 49%;
}

#npcatch li img{
	height: auto;
}

#npcatch li a {
	display: table;
	padding: .5rem 0;
	width: 100%;
}

#npcatch img {
	float: left;
	padding: 0 .5rem 0 0;
}

#npcatch .title {
	overflow: hidden;
	display: block;
	clear: both;
}
@media screen and (min-width: 768px){
	#npcatch li {
	display: inline-block;
	max-width: 32%;
}
}



/*ボタン*/
.square_btn_lrg {
	margin-top: 10px;
    display: inline-block;
    padding: 1.5em 2.5em;
    text-decoration: none;
    color: #222222;
    border: solid 2px #222222;
    border-radius: 3px;
    transition: .4s;
}

.square_btn_lrg:hover {
    background: #ffffff;
    color: #6eb936;
}

/*トップページ新着情報 ここまで*/


/* フッター部分装飾　*/

.widget_nav_menu ul li{
	padding: 0 !important;
}

.footer-widget{
	margin-bottom: 40px;
}

.footer {
   background: url(img/footer_illust.png);
	background-repeat: no-repeat;
	background-position: center top;
	background-size:contain;
	text-align: center;
	color: #FFFFFF;
}

.footer h3{
	background-image:none;
	padding: 0;
    line-height: 40px;
}

p.footer-suponcer {
	margin: 0;
	max-width: 80%;
	text-align: center;
    margin: 0 auto;
	font-weight: normal;
	font-size: 12px;
}
p.footer-suponcer-sp {
	margin: 0;
	max-width: 80%;
	text-align: center;
    margin: 0 auto;
	font-weight: normal;
	font-size: 12px;
}

.footer-cont{
	padding: 15% 0 25px;
}

.footer-sns{
	padding: 5px 0;
}

.footer-sns img{
	padding: 15px;
}

.copyright {
    background: none;
    color: #fff;
    font-size: 18px;
    padding: 15px 0;
}

.footer-widget-area {
	font-size: 14px;
    padding: 60px 0 25px;
    font-weight: 600;
}

.copyright {
    background: none;
    color: #fff;
    font-size: 16px;
    padding: 15px 0;
    text-align: center;
    border-top: solid thin;
}

@media screen and (min-width: 768px){
	.footer-suponcer-sp{
		display: none;
}
}

@media screen and (max-width: 768px){
	.footer-suponcer{
		display: none;}
}

/*生産者紹介テーブル*/
table {
  margin: 20px auto;
}
.tbl-r02{
	width: 100%;
}
.tbl-r02 th {
  background: #e2e2e2;
  border: solid 1px #fff;
  color: #000;
  padding: 10px;
	font-weight: normal;
}
.tbl-r02 td {
　border: solid 1px #000;
  padding: 10px;
}
 
@media screen and (max-width: 640px) {
  .last td:last-child {
    border-bottom: solid 1px #ccc;
    width: 100%;
  }
  .tbl-r02 {
    width: 100%;
  }
  .tbl-r02 th,
  .tbl-r02 td {
　　border-bottom: none;
    display: block;
    width: 100%;
  }
}




/*　コンテンツ　動画表示　*/
.MovieArea {
    position: relative;
    padding-top: 56.65%;
    background-color: #eee;
}

.MovieArea__movie {
    position: relative;
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
}

.MovieArea__movie iframe {
    width: 100%;
    height: 100%;
}


/*トップページYoutube表示*/

	.toppage-intro{
		
	}

	.youtube-box{
		background-image: url(/image/bg-top-oyster.jpg);
		background-repeat: no-repeat;
		background-color: #000000;
		background-size: contain;
		padding-top: 38%;
		
	}
	.youtube-box h2{
		text-align: center;
		color: #FFFFFF;
		margin-bottom: 30px;
	}

/*SP表示*/
@media (max-width: 767px) {
	.youtube-box h2{
		text-align: center;
		color: #FFFFFF;
		margin-bottom: 30px;
		font-size: 120%;
	}

		
	}
	
}
/**
 * Offcanvas navigation
 */
.off-canvas-nav {
  margin: 0;
  overflow: auto;
  overflow-x: hidden;
  padding: 0;
  width: 300px;
  position: fixed;
  top: 0;
  bottom: 0;
	border: none;
  /**
	 * Theme: Dark
	 */ }
  @media (max-width: 320px) {
    .off-canvas-nav {
      width: 220px; } }
  .off-canvas-nav ul, .off-canvas-nav li {
    list-style: none;
    display: block;
    margin: 0;
    padding: 0; }
  .off-canvas-nav a {
    display: block;
    text-decoration: none; }
    .off-canvas-nav a:hover, .off-canvas-nav a:active, .off-canvas-nav a:focus {
      text-decoration: none; }
  .off-canvas-nav--dark {
    background-color: #e2e2e2;
    /* border-top: 1px solid #3c3c3c; */
    /* border-bottom: 1px solid #2f2f2f; */
    /**
		 * First hierarchy
		 */
    /**
		 * Second hierarchy later
		 */
    }
    .off-canvas-nav--dark li {
      border-top: none;/*1px solid #3c3c3c;*/
      border-bottom:none;/* 1px solid #2f2f2f;*/ }
    .off-canvas-nav--dark a {
      color: #000;
      padding: 10px 20px; }
      .off-canvas-nav--dark a:hover, .off-canvas-nav--dark a:active, .off-canvas-nav--dark a:focus {
        background-color: #848484;
        color: #fff; }
    .off-canvas-nav--dark > ul, .off-canvas-nav--dark > * > ul {
      /* border-bottom: 1px solid #3c3c3c; */
      }
    .off-canvas-nav--dark .current-menu-item > a,
    .off-canvas-nav--dark .current_page_ancestor > a,
    .off-canvas-nav--dark .current-page-ancestor > a,
    .off-canvas-nav--dark .current_page_item > a,
    .off-canvas-nav--dark .current_page_parent > a {
      background-color: #848484;
      color: #fff; }
    .off-canvas-nav--dark ul ul {
      border-top: none;/* 1px solid #2f2f2f;*/
      border-left: none;/* 1px solid #2f2f2f;*/
		border: none;
      margin-bottom: -1px;
      margin-left: 3em;
      opacity: 1;
      visibility: visible; }
      .off-canvas-nav--dark ul ul li {
        border-left: 1px solid #3c3c3c; }


/*テーブルCSS*/
table {
  margin: 20px auto;
}
.tbl-r02 th {
	background: #2B3348;
  border: solid 1px #ccc;
  color: #fff;
  padding: 10px;
	width: 150px;
}
.tbl-r02 td {
　border: solid 1px #ccc;
  padding: 10px;
}
.thead th{
  background:#DADADA;
	color: #000;
	}
.oyst-name th{
	width: 12%;	
}

@media screen and (max-width: 640px) {

	.thead{
		display: none;
	}
  .last td:last-child {
    border-bottom: solid 1px #ccc;
    width: 100%;
  }
  .tbl-r02 {
    width: 95%;
  }
  .tbl-r02 th,
  .tbl-r02 td {
　　border-bottom: none;
    display: block;
    width: 100%;
  }
}


/*ラジオじゅけジュール テーブルCSS*/
table {
  margin: 20px auto;
}
.tbl-r03{
	width: 100%;
}
.tbl-r03 th {
	background: #E41F19;
  border: solid 1px #ccc;
  color: #fff;
  padding: 10px;
	width: 150px;
}
.tbl-r03 td {
　border: solid 1px #ccc;
  padding: 10px;
}
.thead th{
  background:#DADADA;
	color: #000;
	}
.radio-time th{
	width: 12%;	
}

@media screen and (max-width: 640px) {

.tbl-r03{
	width: 100%;
}
	.thead{
		display: none;
	}
  .radio-last td:last-child {
    border-bottom: solid 1px #ccc;
    width: 100%;
  }
  .tbl-r03 {
    width: 95%;
  }
  .tbl-r03 th,
  .tbl-r03 td {
　　border-bottom: none;
    display: block;
    width: 100%;
  }
}


/*トップページ　コンテンツCSS*/
.cont-title{
	font-size: 160%;
	font-weight: bold;
	line-height: 1.5em;
}

.button a {
	background: url(img/img-arrow.png) right 15px center no-repeat, url(img/img-button-bg.png);
	border-radius: 30px;		/* CSS3草案 */
	-webkit-border-radius: 30px;	/* Safari,Google Chrome用 */
	-moz-border-radius: 30px;	/* Firefox用 */
	min-width: 300px;
	margin: 20px auto 0;
	padding: 10px 0;
	color: #000;
	font-weight: bold;
	font-size: 110%;
	display: table;
	text-decoration: none;
}
.cont-top-discription{
	padding: 0 30px;
	margin: 20px 0;
}

@media screen and (min-width: 480px) {
.info dt {clear: left;float: left;}
.info dd {margin-left: 0.5em;}
}

.top-cont-box {
	 max-width:1360px;
	 min-height:534px;
	 margin: 0 auto 100px;
	 position:relative;
}

.top-cont-box-img {
position: absolute;
top: 0;
left: 0;
}

.top-cont-box-text {
    position: relative;
    z-index: 2;
    float: right;
    width: 450px;
    margin-top: 40px;
    padding: 50px 0 60px;
	background: url(/image/back-blue.png) repeat;
	text-align: center;
	color: #fff;
}

.top-cont-box-img2 {
position: absolute;
top: 0;
right: 0;
}

.top-cont-box-text2 {
    position: relative;
    z-index: 2;
    float: left;
    width: 450px;
    margin-top: 40px;
    padding: 60px 0;
	background: url(/image/back-brown.png) repeat;
	text-align: center;
	color: #fff;
}

@media screen and (max-width: 1000px) {
.top-cont-box {
	 max-width:100%;
	 min-height: inherit;
	 margin: 0 auto 15%;
	 position:relative;
}
.top-cont-box-img,
.top-cont-box-img2 {
position: static;
}

.top-cont-box-img img,
.top-cont-box-img2 img {
	width: 100%;
}

.top-cont-box-text {
    position: relative;
    z-index: 2;
    width: 90%;
    margin: -30px 5% 50px;
    padding: 7% 2%;
	background-size: 40%, 80%, auto;
}
.top-cont-box-text2 {
    position: relative;
    z-index: 2;
    width: 90%;
    margin: -30px 5% 50px;
    padding: 7% 2%;
	background-size: 40%, 80%, auto;
}
}


.topsponsor {
	text-align: center;
	color: #FFF;
	font-weight: bold;
	margin: 5% auto 0;
	font-size: 120%;
}

.topsponsor img {
	max-width: 100%;
	max-height: 100%;
}


.crossword {
	text-align: center;
	color: #FFF;
	margin: 50px auto 100px;
}

.crosswordT01 {
	font-size: 180%;
	font-weight: bold;
	margin-bottom: 10px;
}

.crosswordT02 {
	font-size: 130%;
	font-weight: bold;
	line-height: 1.5;
	margin-top: 20px;
}

/*SP表示*/
@media (max-width: 767px) {
.button a {
	min-width: 240px;
	font-size: 80%;
	text-align: center;
}
	
.cont-top-discription{
	padding: 0 10px;
	margin: 20px 0;
}
	
.cont-title{
	font-size: 130%;
	font-weight: bold;
	line-height: 1.5em;
	padding-left: 10px;
}

.top-cont-box-text {
	text-align: left;
	}
	

.top-cont-box-text2 {
	text-align: left;
	}
	
}