/*トップページのヘッダー*/

.toppage_header {
  background-color: #efeeea;
  width:100%;
  padding-bottom:50px;
}
@media screen and (max-width: 885px) {
	.toppage_header {
    padding-bottom: 20px;
	}
}
@media screen and (max-width: 321px) {
	.toppage_header {
    padding-bottom: 0px;
	}
}

.mainvisual_space {
  width:100%;
}

.mainvisual_img {
  width:100%;
}
@media screen and (max-width: 429px) {
	.mainvisual_img {
    display:none;
	}
}

.mainvisual_img_mob {
  display:none;
}
@media screen and (max-width: 429px) {
	.mainvisual_img_mob {
    display:block;
    width:100%;
	}
}

.mainvisual_text{
  width:1200px;
  margin:0 auto;
  margin-top:-180px;
  margin-bottom:0px;
}
@media screen and (max-width: 885px) {
	.mainvisual_text {
    width: calc(100% - 20px);
    margin-top:-150px;
    margin-left:20px;
	}
}

.mv_txt_p1 {
  font-size:28px;
  font-weight:bold;
	font-family: "ヒラギノ丸ゴ Pro W4","ヒラギノ丸ゴ Pro","Hiragino Maru Gothic Pro","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","HG丸ｺﾞｼｯｸM-PRO","HGMaruGothicMPRO" ;
  letter-spacing: 8px;
  line-height: 1.7em;
  color: #ffffff;
  text-shadow: 3px 3px 10px 	#663333;
}
@media screen and (max-width: 429px) {
	.mv_txt_p1 {
    font-size:24px;
    letter-spacing: 4px;
	}
}
@media screen and (max-width: 320px) {
	.mv_txt_p1 {
    font-size:22px;
    letter-spacing: 2px;
	}
}

.mv_txt_p2 {
  font-size: 20px;
  font-weight:bold;
	font-family: "ヒラギノ丸ゴ Pro W4","ヒラギノ丸ゴ Pro","Hiragino Maru Gothic Pro","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","HG丸ｺﾞｼｯｸM-PRO","HGMaruGothicMPRO" ;
  letter-spacing: 8px;
  line-height: 1.7em;
  margin-top: 10px;
  color: #ffffff;
}
@media screen and (max-width: 429px) {
	.mv_txt_p2 {
    font-size:13px;
    letter-spacing: 4px;
	}
}
@media screen and (max-width: 376px) {
	.mv_txt_p2 {
    font-size:14px;
    letter-spacing: 1px;
	}
}
@media screen and (max-width: 320px) {
	.mv_txt_p2 {
    font-size:12px;
    letter-spacing: 1px;
	}
}


.sales_button {
  width:1200px;
  margin:0 auto;
  display:flex;
  justify-content: space-between;
}
@media screen and (max-width: 885px) {
	.sales_button {
    width:98%;
    justify-content: center;
	}
}
@media screen and (max-width: 429px) {
	.sales_button {
    flex-direction: column;
    margin-top:20px;
    margin-bottom:20px;
	}
}
@media screen and (max-width: 321px) {
	.sales_button {
    margin-top:70px;
	}
}

.sponsorlink {
    width:50%;
    margin-top:100px;
}
@media screen and (max-width: 885px) {
	.sponsorlink {
    margin-top: 50px;
	}
}
@media screen and (max-width: 429px) {
	.sponsorlink {
    width:100%;
    text-align:center;
	}
}
@media screen and (max-width: 321px) {
	.sponsorlink {
    margin-top:0px;
    margin-bottom:40px;
	}
}

.sponsorlink a {
  text-decoration: none;
}

.sponsorlink a img:hover {
  opacity: 0.8;
}

.forsponsor {
  width:94%;
  height:140px;
  position: relative;
  margin-top:-180px;
  z-index:1;
}
@media screen and (max-width: 885px) {
	.forsponsor {
    height: auto;
    margin-top:-180px;
	}
}

.tanomail {
  width:27%;
}
@media screen and (max-width: 885px) {
	.tanomail {
    height: auto;
	}
}

.daiya {
  width:27%;
  margin-left: 5%;
}
@media screen and (max-width: 885px) {
	.daiya {
    height: auto;
	}
}

.ocean {
    width: 27% !important;
  height: auto !important;
  margin-left: 5%;
}
@media screen and (max-width: 885px) {
  .ocean {
    width: 27% !important;
    height: auto !important;
  }
}

.forsponsor_txt {
  margin-top:60px;
  margin-left: 140px;
  position: relative;
  z-index:2;
}
@media screen and (max-width: 885px) {
	.forsponsor_txt {
    margin-top:20px;
    margin-left:10px;
	}
}
@media screen and (max-width: 835px) {
	.forsponsor_txt {
    margin-top:15px;
	}
}
@media screen and (max-width: 821px) {
	.forsponsor_txt {
    margin-top:10px;
	}
}
@media screen and (max-width: 320px) {
	.forsponsor_txt {
    margin-top:20px;
	}
}

.forsponsor_p1 {
  font-size:20px;
  color:#ffffff;
  font-family: "ヒラギノ丸ゴ Pro W4","ヒラギノ丸ゴ Pro","Hiragino Maru Gothic Pro","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","HG丸ｺﾞｼｯｸM-PRO","HGMaruGothicMPRO" ;
  line-height: 2em;
  text-shadow: 3px 3px 20px 	#000;
}

.forsponsor_p2 {
  font-size:16px;
  color:#ffffff;
  font-family: "ヒラギノ丸ゴ Pro W4","ヒラギノ丸ゴ Pro","Hiragino Maru Gothic Pro","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","HG丸ｺﾞｼｯｸM-PRO","HGMaruGothicMPRO" ;
  text-shadow: 3px 3px 20px 	#000;
}
@media screen and (max-width: 769px) {
	.forsponsor_p2 {
    font-size:14px;
	}
}
@media screen and (max-width: 361px) {
	.forsponsor_p2 {
    font-size:12px;
	}
}


/*お知らせ欄、トピックス欄*/

.newsspace_center_line {
  border:1px solid #cfc7c5;
  background:#cfc7c5;
}

/*お知らせ欄、トピックス欄*/

.newsspace_center_line {
  border:1px solid #cfc7c5;
  background:#cfc7c5;
}

.news_topics {
  width:100%;
  border-bottom:2px solid  #efeeea;
}

.news_topics_space {
  width:1200px;
  margin:0 auto;
  display:flex;
  justify-content:space-between;
  margin-top:50px;
  margin-bottom:50px;
}
@media screen and (max-width: 884px) {
	.news_topics_space {
    width:98%;
	}
}

.news_space {
  width:48%;
}

.news_space_title {
  font-family: "ヒラギノ丸ゴ Pro W4","ヒラギノ丸ゴ Pro","Hiragino Maru Gothic Pro","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","HG丸ｺﾞｼｯｸM-PRO","HGMaruGothicMPRO" ;
  color:#568163;
  border-bottom: 1px solid #cfc7c5;
  font-size:23px;
  letter-spacing: 2px;
  width:100%;
  line-height: 1.5em;
  display:block;
}

.news_topics_space .news_space_title:nth-last-of-type(1){ margin-right: 0; }
.news_topics_space input {		/* ラジオボタン非表示 */
	display: none;
}

.news_space_title span {
  font-size:13px;
  padding-left:1em;
}

.news_space_body {
  height: 300px;
  margin-top: 40px;
  overflow-y: scroll;
}
.news_space_body.news {
  margin-top: 0px;
}

.news_space_body::-webkit-scrollbar {
  width: 10px
}

.news_space_body::-webkit-scrollbar-track {
  background: #c5d0cc;
  border-radius: 5px;
}

.news_space_body::-webkit-scrollbar-thumb {
  background: #66aa84;
  border-radius: 5px;
}

.news_space_history {
  height: 35px;
  text-align: right;
  margin-top: 5px;
}
.news_space_history a {
  color: blue;
}

.news_space_link {
  display: inline-block;
  margin: 5px;
  padding: 5px 1rem 0;
  min-width: 10rem;
  min-height: 28px;
  text-align: center;
  background-color: rgb(104, 170, 132);
  color: rgb(255, 255, 255);
  font-size: 15px;
  letter-spacing: 3px;
  font-family: "ヒラギノ丸ゴ Pro W4", "ヒラギノ丸ゴ Pro", "Hiragino Maru Gothic Pro", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", HG丸ｺﾞｼｯｸM-PRO, HGMaruGothicMPRO;
  line-height: 1.5rem;
  text-decoration: none;
  border-radius: 1.5rem;
}
.news_space_link:hover {
  opacity: 0.7;
}

.overflowbox{
  width:100%;
  height:109em;
  overflow: hidden;
}

/*トップページ用のnews topicsの内容、お知らせ一覧ページでは別のスタイルを適用*/

.news_dl {
  width:100%;
  display:flex;
  flex-wrap: wrap;
}

.dt_time {
  display: block;
  width:30%;
}

.dt_tag {
  display:block;
  width:70%;
}

.dt_tag span {
  display:block;
  width:12em;
  text-align:center;
  border-radius:5px;
  color:#ffffff;
  font-family: "ヒラギノ丸ゴ Pro W4","ヒラギノ丸ゴ Pro","Hiragino Maru Gothic Pro","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","HG丸ｺﾞｼｯｸM-PRO","HGMaruGothicMPRO" ;
  line-height: 1.7em;
  letter-spacing: 2px;
}
@media screen and (max-width: 429px) {
	.dt_tag span {
    float:right;
    font-size:13px;
	}
}

.tag_event {
  background:#eda01c;
}

.tag_school {
  background:#13bbe8;
}

.tag_wefare {
  background:#4779e8;
}

.tag_other {
  background:#696969;
}

.tag_yahoo {
  background:#f85598;
}

.tag_juseinews{
  background:#1e9591;
}

.tag_orange{
  background:orange;
}

.tag_blue{
  background:#6699ff;
}

.tag_purple{
  background:purple;
}

.tag_brown{
  background:#a52a2a;
}

.tag_chocolate{
  background:#d2691e;
}

.tag_olivedrab{
  background:#6b8e23;
}

.tag_darkgray{
  background:#696969;
}

.tag_red{
  background:#ff6347;
}

.dd_title {
  display: block;
  width:100%;
  color:#8f6f6c;
  font-size:18px;
  margin-top:1em;
  margin-bottom:0.5em;
}
.dd_title a, .dd_title a:visited {
  color: blue;
}

.dd_body {
  display: block;
  width:100%;
  color:#333;
  font-size:14px;
  letter-spacing:1px;
}

.dd_link {
  display: block;
  width:100%;
  margin-bottom:3em;
}

/*スマートフォンでのタブ表示*/

@media screen and (max-width: 429px) {
	.news_topics {
    display:none;
	}
}

.news_topics_mob {
  display:none;
}
@media screen and (max-width: 429px) {
	.news_topics_mob {
    display:block;
	}
}

/*ベース*/
.news_topics_mob .news_topics_space{
	display: flex;
	flex-wrap: wrap;
}

.news_topics_mob .news_topics_space::after {
	content: '';
	width: 100%;
	height: 3px;
	order: -1;
	display: block;
	background: rgba(86,129,99,.7);
}

.news_topics_mob .news_topics_space .news_space_title {	/* タブ */
	margin-right: 3px;
	padding: 3px 12px;
	flex: 1;
	order: -1;
	border-radius: 3px 3px 0 0;
	color: #ccc;
	background: rgba(102,170,130,.3);
	transition: .5s ;
	cursor: pointer;
}

.news_topics_mob .news_topics_space .news_space_title:nth-last-of-type(1){ margin-right: 0; }
.news_topics_mob .news_topics_space input {		/* ラジオボタン非表示 */
	display: none;
}

.news_topics_mob .news_topics_space .news_space_body {	/* 本文 */
	width: 100%;
	height: 0;
	overflow: hidden;
	opacity: 0;
  margin-top: 30px;
}
.news_topics_mob .news_topics_space .news_space_body.news {
  margin-top: 0px;
}
.news_topics_mob .news_topics_space .news_space_history {
	height: 0;
	opacity: 0;
}
/*アクティブ設定*/
.news_topics_mob .news_topics_space input:checked + .news_space_title {
	color: #fff;
	background: rgba(86,129,99,.7);
}
.news_topics_mob .news_topics_space input:checked + .news_space_title + .news_space_history + .news_space_body,
.news_topics_mob .news_topics_space input:checked + .news_space_title + .news_space_body {
	padding: 15px;
	height: 15em;
	overflow-y: scroll;
	transition: .5s opacity;
	opacity: 1;
}
.news_topics_mob .news_topics_space input:checked + .news_space_title + .news_space_history {
  width: 98%;
  height: 35px;
	opacity: 1;
}



/*フリースペースとGoogleカレンダー*/

.freesp_gcal {
  width:100%;
  margin-top:50px;
}

.fsgc_space {
  width:1200px;
  margin:0 auto;
  display:flex;
  justify-content: space-between;
}
@media screen and (max-width: 885px) {
	.fsgc_space {
    width:100%;
	}
}
@media screen and (max-width: 429px) {
	.fsgc_space {
    flex-direction: column;
    justify-content: center;
	}
}

.fsgc_box {
  width:50%;
}
@media screen and (max-width: 429px) {
	.fsgc_box  {
    width:100%;
	}
}

.freespace {
  width:97%;
  border:2px solid #cdc8c5;
}
@media screen and (max-width: 429px) {
	.freespace  {
    width:98%;
    margin-left:0.5%;
    margin-bottom:1em;
	}
}

.freespace div {
  width:90%;
  height:27em;
  margin:5%;
  overflow-y:scroll;
}
@media screen and (max-width: 885px) {
	.freespace div {
    height:28em;
	}
}
@media screen and (max-width: 429px) {
	.freespace div {
    height:10em;
	}
}

.freespace div::-webkit-scrollbar {
  width: 10px
}

.freespace div::-webkit-scrollbar-track {
  background: #c5d0cc;
  border-radius: 5px;
}

.freespace div::-webkit-scrollbar-thumb {
  background: #66aa84;
  border-radius: 5px;
}

.freespace div label {
  color:#568163;
  font-size:20px;
}

.freespace div p {
  margin-top:1em;
  padding-bottom:3em;
  border-bottom:1px solid #c5d0cc;
}

.cal_button {
  width:100%;
  display:flex;
  justify-content: flex-end;
  flex-direction: column;
  align-items: flex-end;
}

.cal_button iframe {
  width:97%;
  height:25em;
}
.cal_button iframe::after {
  clear:both;
}
@media screen and (max-width: 429px) {
	.fsgc_box iframe {
    width:80%;
    height:15em;
    clear: both;
    margin-right:10%;
	}
}


/*メルマガ誘導ボタンのPC表示用*/

.mailmaga_button {
  width:97%;
  display:flex;
  justify-content: space-between;
  margin-top: 20px;
}
@media screen and (max-width: 885px) {
  .mailmaga_button {
    display:none;
	}
}

.mailmaga_button a {
  display:block;
  width:48%;
  height: 3em;
  text-decoration:none;
  color:#ffffff;
  background:#66aa84;
  border-radius: 5px;
  text-align:center;
  padding-top:1.5em;
  position:relative;
}

.mailmaga_button a:hover{
  opacity: 0.7;
}

.mailmaga_button a span {
  font-size: 14px;
  font-family: "ヒラギノ丸ゴ Pro W4","ヒラギノ丸ゴ Pro","Hiragino Maru Gothic Pro","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","HG丸ｺﾞｼｯｸM-PRO","HGMaruGothicMPRO" ;
  letter-spacing: 2px;
}
@media screen and (max-width: 885px) {
  .mailmaga_button a span {
    font-size: 14px;
	}
}

.mailmaga_button a .left_button::before{
  content: '';
  display: inline-block;
  width: 22px;
  height: 22px;
  background-image: url(../images/icon01.svg);
  background-size: contain;
  vertical-align: middle;
  background-repeat: no-repeat;
  position: absolute;
  top:35%;
  left:5%;
}

.mailmaga_button a .right_button::before{
  content: '';
  display: inline-block;
  width: 22px;
  height: 22px;
  background-image: url(../images/icon02.svg);
  background-size: contain;
  vertical-align: middle;
  background-repeat: no-repeat;
  position: absolute;
  top:40%;
  left:5%;
}

.mailmaga_button a span::after{
  content: '';
  display: inline-block;
  width: 10px;
  height: 10px;
  background-image: url(../images/owin.png);
  background-size: contain;
  vertical-align:baseline;
  background-repeat: no-repeat;
  position:absolute;
  top:70%;
  left:90%;
}


/*メルマガ誘導ボタンのスマートフォン表示用*/

.mailmaga_button_mob {
  display: none;
}
@media screen and (max-width: 885px) {
  .mailmaga_button_mob{
    display:block;
    width:97%;
    display:flex;
    justify-content: space-between;
    margin-top: 20px;
	}
}
@media screen and (max-width: 885px) {
  .mailmaga_button_mob{
    width:90%;
    margin-right:5%;
	}
}

.mailmaga_button_mob a {
  display:block;
  width:48%;
  height: 3.75em;
  text-decoration:none;
  color:#ffffff;
  background:#66aa84;
  border-radius: 5px;
  text-align:center;
  padding-top:0.75em;
  position:relative;
}

.mailmaga_button_mob a:hover{
  opacity: 0.7;
}

.mailmaga_button_mob a span {
  font-size: 13px;
  font-family: "ヒラギノ丸ゴ Pro W4","ヒラギノ丸ゴ Pro","Hiragino Maru Gothic Pro","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","HG丸ｺﾞｼｯｸM-PRO","HGMaruGothicMPRO" ;
  letter-spacing: 2px;
}
@media screen and (max-width: 416px) {
  .mailmaga_button_mob a span {
    font-size:10px;
	}
}

.mailmaga_button_mob a .left_button::before{
  content: '';
  display: inline-block;
  width: 22px;
  height: 22px;
  background-image: url(../images/icon01.svg);
  background-size: contain;
  vertical-align: middle;
  background-repeat: no-repeat;
  position: absolute;
  top:35%;
  left:5%;
}

.mailmaga_button_mob a .right_button::before{
  content: '';
  display: inline-block;
  width: 22px;
  height: 22px;
  background-image: url(../images/icon02.svg);
  background-size: contain;
  vertical-align: middle;
  background-repeat: no-repeat;
  position: absolute;
  top:40%;
  left:5%;
}

.mailmaga_button_mob a span::after{
  content: '';
  display: inline-block;
  width: 10px;
  height: 10px;
  background-image: url(../images/owin.png);
  background-size: contain;
  vertical-align:baseline;
  background-repeat: no-repeat;
  position:absolute;
  top:70%;
  left:90%;
}


.newproducts {
  width: 100%;
  background-image: url(../images/toppage/bg_newpro.png);
  margin-top:50px;
}

.newproducts_space {
  width:1200px;
  margin:0 auto;
  padding:100px 0px;
}
@media screen and (max-width: 885px) {
  .newproducts_space {
    width:100%;
	}
}
@media screen and (max-width: 429px) {
  .newproducts_space {
    padding:30px 0px;
	}
}

.newproducts_title {
  color:#568163;
  font-family: "ヒラギノ丸ゴ Pro W4","ヒラギノ丸ゴ Pro","Hiragino Maru Gothic Pro","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","HG丸ｺﾞｼｯｸM-PRO","HGMaruGothicMPRO" ;
  letter-spacing: 3px;
  font-size:26px;
  border-bottom:2px solid #c6c1ce;
}
@media screen and (max-width: 429px) {
  .newproducts_title {
    font-size:20px;
	}
}

.newproducts_title span {
  letter-spacing: 2px;
  font-size:16px;
  padding-left:1em;
}
@media screen and (max-width: 429px) {
  .newproducts_title span {
    font-size:9px;
	}
}

.newproducts .newproducts_space iframe {
  aspect-ratio: 16 / 9;
  width: 100%;
  height: 100%;
}


.commercial{
    width: 100%;
    background-image: url(../images/toppage/bg_commercial.png);
    border-top:2px solid #d7d2cf;
}

.commercial_space{
  width:1200px;
  margin:0 auto;
  padding:100px 0px;
}
@media screen and (max-width: 885px) {
  .commercial_space {
    width:100%;
	}
}
@media screen and (max-width: 429px) {
  .commercial_space {
    padding:20px 0px;
	}
}

.commercial_title{
  color:#568163;
  font-family: "ヒラギノ丸ゴ Pro W4","ヒラギノ丸ゴ Pro","Hiragino Maru Gothic Pro","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","HG丸ｺﾞｼｯｸM-PRO","HGMaruGothicMPRO" ;
  letter-spacing: 3px;
  font-size:26px;
  border-bottom:2px solid #c6c1ce;
}
@media screen and (max-width: 429px) {
  .commercial_title {
    font-size:20px;
	}
}

.commercial_title span{
  letter-spacing: 2px;
  font-size:16px;
  padding-left:1em;
}
@media screen and (max-width: 429px) {
  .commercial_title span {
    font-size:9px;
	}
}


.slider{
  width:95%;
  margin:0 auto;
  margin-top:20px;
}
@media screen and (max-width: 885px) {
  .slider {
    width:90%;
	}
}
@media screen and (max-width: 428px) {
  .slider {
    width:85%;
	}
}

.slider div{
  margin: 10px
}
@media screen and (max-width: 428px) {
  .slider div {
    margin:3px;
	}
}

@media screen and (max-width: 885px) {
  .slider div div iframe{
    width:50%;
	}
}

.slider div p{
  margin:10px;
}


.kakakuhyo_linkbutton {
  display: block;
  width:30%;
  margin:0 auto;
  color:#ffffff;
  background:#66aa84;
  font-size:20px;
  text-align:center;
  border-radius: 10px;
  line-height: 3em;
  letter-spacing:2px;
  position: relative;
}
@media screen and (max-width: 428px) {
  .kakakuhyo_linkbutton {
    width: 80%;
  }
}

.kakakuhyo_linkbutton span::before{
  content: '';
  display: inline-block;
  width: 30px;
  height: 30px;
  background-image: url(../images/arroww.png);
  background-size: contain;
  vertical-align:middle;
  background-repeat: no-repeat;
  position:absolute;
  top:24%;
  left:15%;
}
@media screen and (max-width: 885px) {
  .kakakuhyo_linkbutton span::before{
    left:5%;
	}
}
@media screen and (max-width: 428px) {
  .kakakuhyo_linkbutton span::before{
    left:5%;
	}
}




.kakakuhyo_linkbutton:hover{
  opacity: 0.7;
}
