@charset "shift_jis";

#wrap h1 {
	margin-top: 0;
	margin-bottom: 0;
}
/*
div#wrap a:hover img {
	opacity:0.7;
	filter: alpha(opacity=70);
	-ms-filter: "alpha( opacity=70 )";
	background: #fff;
}
*/
	
#main{
	margin:0;
	padding:0;
}
#contents{
	width:100%;
	text-align:left
}
#contents img{
	float:none;
	width:100%;
	height:auto;
	margin:0;
	padding:0;
}
#contents .obj_box{
	padding-bottom:0;
}

#contents .obj_box ul{
	list-style:none;
}

#contents .obj_box  li{
	float:left;
	position:relative;
	margin:0;
	padding:0;
}

#contents .obj_box li div{
	overflow:hidden;
}

/*--- 特徴を比較して選ぶ ---*/
#contents .obj_box2{
	padding-bottom:0;
}

#contents .obj_box2 ul{
	list-style:none;
}

#contents .obj_box2 li{
	float:left;
	position:relative;
	margin:0;
	padding:0;
}

#contents .obj_box2 li a{
	display:block;
	overflow:hidden;
	width:96px;
	height:96px;

}
#contents .obj_box2 li div img{
	width:96px;
	height:192px;
}

#contents .obj_box2 li a:hover img{
	opacity:1.0;
	filter: alpha(opacity=100);
	-ms-filter:alpha( opacity=100);
	background-color: transparent;
	margin-top:-96px;
}

#contents .obj_box2 li a:hover{
	z-index:9999;
}

.mt10{margin-top: 10px!important;}
.mt20{margin-top: 20px!important;}
.mt30{margin-top: 30px!important;}
.mt40 { margin-top:40px;}
.mt50 { margin-top:50px;}
.mb10 { margin-bottom:10px;}
.mb20 { margin-bottom:20px;}
.mr10 { margin-right:10px;}
.mr20 { margin-right:20px;}


/*  240924  */
#main{
	background-image: url(/contents/syunya/season/rice/images/bk.png);
	margin: auto;
	padding: 0 10px;
}
.webfont {
	font-family: "Noto Sans JP", sans-serif;
	font-feature-settings: "palt" 1;
}
.maindesign .litxt {
	text-align: justify;
	font-size: 0.8em;
	font-weight: normal;
	line-height: 1.4;
}

.head_line {
  background-repeat:repeat-x;
	background: transparent url(/include_html/sp/syunya/img/top/head_line.png) repeat-x 0 0;
	background-size: 90px 34px; /*←背景画像を領域よりも大きく*/
        height: 33px;
      }
      .text_box {
        margin-top: 10px;
      }

      #contents .images1 {
        width: 100%;
      }
      #contents .images2 {
        width: 50%;
      }
      #contents ul {
        　　padding: 10px !important;
      }
      #contents h3 {
        /*height: 50px;*/
      }
      #contents h3 > img {
        height: 100%;
        width: inherit;
      }
      #calender a {
        width: 100%;
        height: 100%;
      }

      #calender a img {
        width: 100%;
        height: 100%;
      }

      .spacer {
        width: 100% !important;
        height: 100% !important;
      }

      #separat {
        width: 100%;
        display: block;
        margin: 0 auto;
      }
      #separat_2 {
        width: 100%;
        display: block;
        margin: 0 auto;
      }
      #separat_3 {
        width: 100%;
        display: block;
        margin: 0 auto;
      }
      .description {
        font-size: 1em;
        background: #cfcfcf;
        text-align: left;
        line-height: 1.6;
        padding: 10px 20px;
        text-align: justify;
        margin: 0;
        margin-bottom: 30px;
      }
      @media screen and (max-width: 699px) {
        .wide_size {
          display: none;
        }
        .short_size {
          display: block;
        }

        #separat li {
          width: 50%;
          /*margin:4px;*/
          float: left;
          position: relative;
        }
        #separat_2 li {
          /*width:50%;*/
          /*margin:4px;*/
          width: 100%;
          float: left;
          position: relative;
        }
        #separat_3 li {
          width: 50%;
          /*margin:4px;*/
          float: left;
          position: relative;
        }

        #comparison {
          overflow-x: scroll;
          width: 100%;
          /*img:height:472px width:984px*/
          height: 267px;
        }
        #floatmask1 {
          overflow: hidden;
          width: 702.8px;
          height: 267px;
        }
        #seasons {
          overflow-x: scroll;
          width: 100%;
          /*img:height:716px width:1004px*/
          height: 500.5px;
        }
        #floatmask2 {
          overflow: hidden;
          width: 702.8px;
          height: 500.5px;
        }

        .scale {
          transform: scale(0.7);
          transform-origin: 0px 0px;
        }
      }
      @media screen and (min-width: 700px) {
        /* 表示領域が700px以上の場合に適用するスタイル */
        .wide_size {
          display: block;
        }
        .short_size {
          display: none;
        }

        #separat li {
          width: 33.33%;
          /*margin:4px;*/
          float: left;
          position: relative;
        }
        #separat_2 {
          width: 100%;
          display: block;
          margin: 0 auto;
        }
        #separat_2 li {
          width: 49.6%;
          /*margin:4px;*/
          display: inline-block;
          position: relative;
        }

        #comparison {
          overflow-x: scroll;
          width: 100%;
          /*img:height:472px width:984px*/
          height: 472px;
        }
        #floatmask1 {
          overflow: hidden;
          width: 1004px;
          height: 504px;
        }
        #seasons {
          overflow-x: scroll;
          width: 100%;
          /*img:height:716px width:1004px*/
          height: 716px;
        }
        #floatmask2 {
          overflow: hidden;
          width: 1004px;
          height: 716px;
        }
        .scale {
          transform: scale(1);
          transform-origin: 0px 0px;
        }
      }
      .maindesign .breadcrumb {
        box-sizing: border-box;
        color: #83838f;
        display: flex;
        flex-wrap: wrap;
        font-size: 0.875em;
        line-height: 1.5;
        padding: 10px 0 0;
      }
      .maindesign .breadcrumb a {
        color: #83838f !important;
        text-decoration: none;
      }
      @media screen and (max-width: 767px) {
        .description {
          font-size: 0.8em;
        }
        .lititle {
          font-size: 1.1em !important;
        }
      }

      #origin {
        margin-top: 50px;
      }
      .maindesign .goods.cols4-2 .cover-btn {
        position: static;
      }
      .maindesign .goods.cols4-2 li {
        padding-bottom: 0;
      }
      .img_container {
        width: 100%;
        margin-bottom: 30px;
      }
      .img_container > img {
        width: 100%;
        height: auto;
      }

      .maindesign img {
        display: block;
        width: 100%;
        height: auto;
      }
      .maindesign .reservation {
        margin: 0 10px 30px;
      }
      .maindesign .feature-hdg2 {
        position: relative;
        padding-bottom: 1.25rem;
        border-bottom: 3px solid #b6b6b6;
        font-size: 1.5rem;
        margin-top: 1.5rem;
        margin-bottom: 1rem;
        text-align: left;
        line-height: 1.2;
      }
      .maindesign .feature-hdg2::after {
        position: absolute;
        content: " ";
        border-bottom: solid 3px #e5002d;
        bottom: -3px;
        width: 8%;
        display: block;
      }
      .maindesign .lead-text {
        text-align: left;
        font-size: 0.95em;
        line-height: 1.4;
      }
      .maindesign .lead-text__black {
        font-weight: bold;
        font-size: 1.05em;
        color: #000;
      }
      .maindesign .lead-text__red {
        font-weight: bold;
        font-size: 1.05em;
        color: #ff0000;
      }
      .maindesign .half-column {
        display: flex;
        justify-content: space-between;
        flex-wrap: wrap;
      }
      .maindesign .half-column--item {
        width: 49%;
      }
      .maindesign .half-column::before,
      .maindesign .half-column::after {
        content: "";
        display: block;
        height: 0;
        width: 49%;
      }
      .maindesign .half-column::before {
        order: 1;
      }
      .maindesign .half-column .half-column--item:nth-child(n + 3) {
        margin-top: 30px;
      }
      .maindesign .card {
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        box-sizing: border-box;
        margin-bottom: 10px;
        height: 100%;
      }
      .maindesign .card--img {
        min-height: 0%;
        position: relative;
      }
      .maindesign .card--img img {
        display: block;
        width: 100%;
        height: auto;
      }
      .maindesign .card--icon {
        position: absolute;
        background-color: #070597;
        border-radius: 5px;
        font-size: 0.75rem;
        font-weight: bold;
        color: #fff;
        top: 5px;
        left: 5px;
        padding: 5px 5px 3px 5px;
      }
      .maindesign .card--text {
        font-size: 0.95rem;
        font-weight: bold;
        line-height: 1.35;
        margin-top: 10px;
        flex-grow: 1;
        display: flex;
        align-items: flex-start;
      }
      .maindesign .card--text__small {
        font-size: 0.8rem !important;
      }
      .maindesign .card--price {
        font-size: 0.85rem;
        text-align: center;
        margin-top: 5px;
        position: relative;
        margin-bottom: 1rem;
      }

      .maindesign .card--price::after {
        content: "別途送料";
        position: absolute;
        right: 12px;
        bottom: -1.25em;
      }
      .maindesign .card--tax {

        display: inline-block;
        margin-right: 10px;
        font-weight: bold;
      }
      .maindesign .card--num {
        display: inline-block;
        color: #ee221a;
        font-weight: bold;
        font-size: 2em;
      }
      .maindesign .card--yen {
        display: inline-block;
        color: #ee221a;
        font-size: 1.1em;
        font-weight: bold;
      }

      .maindesign .card--btn {
        position: relative;
        background-color: #ea6d0d;
        cursor: pointer;
        border-radius: 40px;
        opacity: 1;
        margin-top: 10px;
      }
      .maindesign .card--btn:hover {
        opacity: 0.75;
        transition: 0.6s;
      }
      .maindesign .card--btn > a {
        text-decoration: none;
        display: inline !important;
      }
      .maindesign .card--btn-inner {
        font-size: 0.85rem;
        font-feature-settings: "palt";
        color: #fff;
        padding: 0.75rem 1.75rem 0.75rem 1.5rem;
        width: auto;
        display: flex;
        align-items: center;
        justify-content: center;
        line-height: 1.3;
        font-weight: bold;
      }
      .maindesign .card--btn-inner::after {
        content: "";
        position: absolute;
        top: 50%;
        right: 18px;
        border-top: 2px solid #fff;
        border-right: 2px solid #fff;
        width: 6px;
        height: 6px;
        transform: translateY(-50%) rotate(45deg);
      }

      .maindesign .reservation-catch {
        position: relative;
        margin-top: 15px;
      }
      .maindesign .reservation-catch--inner {
        position: absolute;
        top: 50%;
        left: 20px;
        transform: translateY(-50%);
        width: 60%;
        height: auto;
        padding: 5px;
        background-color: rgba(255, 255, 255, 0.65);
        box-sizing: border-box;
      }
      .maindesign .reservation-catch--inner img {
        max-height: 90px;
        width: auto;
        display: block;
        margin-inline: auto;
      }

      .maindesign .mt15 {
        margin-top: 15px;
      }
      .p-more-btn {
        margin-top: 30px;
      }
      .p-more-btn a {
        box-sizing: border-box;
        text-align: center;
        display: flex;
        opacity: 1;
        height: 48px;
        align-items: center;
        justify-content: center;
        cursor: pointer;
        font-size: 1rem;
        background: #979797;
        color: #fff;
        font-weight: normal;
        border-radius: 40px;
        max-width: 320px;
        width: 100%;
        margin: 0 auto;
        position: relative;
      }
      .maindesign img.reservation-catch--icon {
        position: absolute;
        top: 4px;
        right: 6%;
        width: 72px;
        height: auto;
      }
      .maindesign .bnr-container {
        margin: 30px 10px 0;
      }
      .maindesign .bnr-container img {
        width: 100%;
        height: auto;
        display: block;
      }



.maindesign .feature-hdg3 {
	font-size: 1.3rem;
	margin-top: calc(60px - 0.6rem);
	margin-bottom: calc(40px - 0.75rem);
	padding-bottom: 0.5rem;
	border-left: 4px solid #f00;
	padding: 0.3rem 1rem;
	text-align: left;
	height: auto;
}
.maindesign .goods.cols4-2{
	justify-content: space-between;
}
.maindesign .goods.cols4-2::before,
.maindesign .goods.cols4-2::after{
	content: "";
	display: block;
	width: 24%;
	height: 0;
}
.maindesign .goods.cols4-2::before{
	order: 1;
	}
.maindesign .goods.cols4-2 li{
	width: 24%;
	margin: 0;
}
.maindesign .goods.cols4-2 li:nth-child(-n + 4){
	margin-top: 0;
}
.maindesign .goods.cols4-2.meigara li{
	padding: 0;
}
.maindesign .goods.cols4-2.meigara li .cover-btn{
	position: static;
}

.maindesign .howto.cols1-1 li{
	padding: 0;
}
.maindesign .howto.cols1-1 li a{
	flex-wrap: wrap;
	padding: 10px;
}
.maindesign .howto.cols1-1 li .linksImg{
	width: 110px;
	margin: 0;
}
.maindesign .howto.cols1-1 li .linksTxt{
	width: calc(100% - 110px);
	margin: 0;
}

.maindesign .slider-block{
	overflow: auto;
}
.maindesign .jp-map{
	position: relative;
	width: 800px;
	margin-bottom: 30px;
}
	.maindesign .jp-map .akita,
	.maindesign .jp-map .yamagata,
	.maindesign .jp-map .miyagi,
	.maindesign .jp-map .niigata,
	.maindesign .jp-map .ishikawa,
	.maindesign .jp-map .toyama,
	.maindesign .jp-map .fukui,
	.maindesign .jp-map .ehime{
		position: absolute;
	}
	.maindesign .jp-map .akita{
		width: 12.6%;
		height: 5.6%;
		right: 39.6%;
		top: 34.4%;
	}	
	.maindesign .jp-map .yamagata{
		width: 12.6%;
		height: 5.6%;
		right: 39.6%;
		top: 41.7%;
	}
	.maindesign .jp-map .miyagi{
		width: 12.6%;
		height: 5.6%;
		right: 14.0%;
		top: 50.9%;
	}
	.maindesign .jp-map .niigata{
		width: 12.6%;
		height: 5.6%;
		left: 31.0%;
		top: 27.3%;
	}
	.maindesign .jp-map .ishikawa{
		width: 12.6%;
		height: 5.6%;
		left: 31.0%;
		top: 34.3%;
	}
	.maindesign .jp-map .toyama{
		width: 12.6%;
		height: 5.6%;
		left: 31.0%;
		top: 41.6%;
	}
	.maindesign .jp-map .fukui{
		width: 12.6%;
		height: 5.6%;
		left: 31.0%;
		top: 48.9%	;
	}
	.maindesign .jp-map .ehime{
		width: 12.6%;
		height: 5.6%;
		left: 16.2%;
		bottom: 11.3%;
	}


	.maindesign .jp-map label img{
		height: 100% !important;
		transition: 0.3s;
	}
	.maindesign .jp-map label:hover img{
		opacity: 0.6;
		background: #fff;
}

.maindesign .feature-hdg4{
	font-size: 1.4em;
	font-weight: bold;
	margin-bottom: 30px;
}

/*  モーダル  */
.maindesign .open {
	cursor:pointer; /* マウスオーバーでカーソルの形状を変えることで、クリックできる要素だとわかりやすいように */
	display: flex;
	align-items: center;
    width: 100%;
/*    padding: 10px;*/
}
.maindesign .open.konomi{
	font-size: 1.15em;
	font-weight: bold;
	color: #1a0dab;
	width: fit-content;
}
.maindesign .open img{
	width: 100%;

}
.maindesign #konomi,
.maindesign #akita,
.maindesign #yamagata,
.maindesign #miyagi,
.maindesign #niigata,
.maindesign #ishikawa,
.maindesign #toyama,
.maindesign #fukui,
.maindesign #ehime{
	display: none; /* label でコントロールするので input は非表示に */
}
.maindesign .overlay {
	display: none; /* input にチェックが入るまでは非表示に */
}
.maindesign #konomi:checked + .overlay,
.maindesign #akita:checked + .overlay,
.maindesign #yamagata:checked + .overlay,
.maindesign #miyagi:checked + .overlay,
.maindesign #niigata:checked + .overlay,
.maindesign #ishikawa:checked + .overlay,
.maindesign #toyama:checked + .overlay,
.maindesign #fukui:checked + .overlay,
.maindesign #ehime:checked + .overlay{
	display: block;
	z-index: 9999;
	background-color: rgba(0,0,0,0.4);
	position: fixed;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
}
.maindesign .window {
	width: calc(90% - 40px);
	height: auto;
	background-color: #ffffff;
	border-radius: 6px;
	/*display: flex;*/
	justify-content: center;
	align-items: center;
	position: fixed;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	padding:20px;
}
.maindesign .text {
	font-size: 18px;
	margin: 0;
}
.maindesign .close {
	cursor: pointer;
    position: absolute;
    top: -60px;
    right: -20px;
    font-size: 20px;
    transform: translateX(-50%);
    padding: 15px;
    background-color: rgba(0,0,0,0.5);
    color: #fff;
}