@charset "UTF-8";



html {
/*
  background-image: url(../img/design.jpg);
  background-position: center 0;
  background-repeat: no-repeat;
*/
/*
  background-image: url(../img/design_sp1.jpg);
  background-position: center 0;
  background-repeat: no-repeat;
  background-size: contain;
*/
/*
  background-image: url(../img/design_sp2.jpg);
  background-position: center 6380px;
  background-repeat: no-repeat;
  background-size: contain;
*/
}
body {
/*
	opacity: 0.5!important;
*/
}


body {
    background-color: #fff;
    color: #3e3a39;
    opacity: 1;
    transition: opacity .8s;
}
body.invisible {
    opacity: 0;
}

/* layout */
header {
    padding: 0 0 3.4%;
    margin: 0 auto;
}

.link_instagram {
	position: absolute;
	top: 60px;
	right: 60px;
}
.link_instagram a{
	display: block;
	color: #4F0002;
	font-size: 45px;
	line-height: 1em;
	padding-top: 22px;
	width: 90px;
	height: 90px;
	text-align: center;
	background: #fff;
	border-radius: 50% 50% 50% 50%;
}

.link_instagram a:hover{
	color: #fff;
	background: #4F0002;
}
.link_instagram_footer {
	margin: 0 auto;
}
.link_instagram_footer a{
	margin: 0 auto 1%;
	display: block;
	border: 1px solid #4F0002;
	color: #4F0002;
	font-size: 30px;
	line-height: 1em;
	padding-top: 15px;
	width: 60px;
	height: 60px;
	text-align: center;
	background: #fff;
	border-radius: 50% 50% 50% 50%;
}
.link_instagram_footer a:hover{
	color: #fff;
	background: #4F0002;
}

/* acordion */
.accordion .accordion-target {
    transition: .3s all ease 0s;
    overflow: hidden;
    opacity: 1;
}
.accordion.close .accordion-target {
    opacity: 0!important;
    height: 0!important;
}
.accordion .accordion-trigger .icon {
    display: inline-block;
    transition: .3s all ease 0s;
    transform: rotate(-180deg);
}
.accordion.close .accordion-trigger .icon {
    transform: rotate(0deg);
}

/* nav-tab */
.nav-tab {
}
.nav-tab .tab {
    display: flex;
    margin: 0 auto;
    width: 37%;
    min-width: 360px;
}
.nav-tab .tab li {
    margin: 0 8.2%;
}
a.active img.over {
    z-index: 1;
}

/* flex */
.cols {
    display: flex;
}

/* btn-block */
.btn-block {
    text-align: center;
}
.btn-block .btn {
    padding: 33px 0 0;
    min-width: 380px;
    margin: 0 8px;
    font-size: 1rem;
    letter-spacing:	0.22em;
    display: inline-block;
    height: 90px;
    line-height: 1.8rem;
    background: #4F0002;
    border: 1px solid #4F0002;
}
.btn-block .btn-orange {
	width: 380px;
	letter-spacing:	0.12em;
    padding-left:	12px;
    background: #EA5504;
    border: 1px solid #EA5504;
}
.btn-block .btn-orange.btn-animate i {
	margin:	0 0 0 8px
}
.btn-block .btn:hover {
    color: #4F0002;
}
.btn-block .btn-orange:hover {
    color: #EA5504;
}


.btn-block .btn-gradation {
    background-image: url(../img/bg_btn_grad.jpg);
    background-size: 100%;
    background-repeat: repeat-y;
    border-color: #d72d20;
}
.btn-block .btn-rollover {
    padding: 0;
}

/* content-block */
.content-block .content-block__body {
/*    width: 980px;*/
/*    max-width: 100%;*/
    margin: 0 auto;
    text-align: center;
}
.content-block.content-block-full .content-block__body {
    width: auto;
}
.content-block.content-block-full .content-block__body picture img {
    width: 100%;
}

/* section-item */
.section-item {
    display: none;
}
.section-item.active {
    display: block;
}







/* ************ uchi 追加分 ヘッダ **************** */
.top_message {
	max-width:		661px;
	margin:		-9.2% auto 0;
}
.top_message2 {
	max-width:		457px;
	margin:		1.3% auto 0;
}


.section-item .content-block-item-1 {
    margin-left: 5.5%;
}
.section-item#section-item-1 .content-block.content-block-item-1 .content-block__body {
    width:			100%;
/*    max-width:		1700px;*/
    margin:			0 auto;
}

.section-item .content-block-item-2 {
    padding: 5.5% 0 1.8%;
/*    background-color: #f9f3e3;*/
}
.section-item#section-item-1 .content-block.content-block-item-2 .content-block__body {
    max-width:		372px;
    margin:		0 auto;
}
.section-item#section-item-1 .content-block.content-block-item-3 .content-block__body {
    max-width:		980px;
    margin:		0 auto;
}






.section-item#section-item-3 .content-block-item-2 {
    padding-top: 0;
}
.section-item .content-block-item-3 {
    background-size: auto 100%;
    padding: 0 0 7.1%;
    background-position: center top;
    background-repeat: no-repeat;
}
.section-item .content-block-item-3 .content-block__body .cols__block-1 {
    width: 36.2%;
}
.section-item .content-block-item-3 .content-block__body .cols__block-2 {
    padding: 0;
    text-align: left;
}
.section-item .content-block-item-3 .content-block__body .pic-block {
    padding: 0 0 0 0;
}
.section-item .content-block-item-3 .content-block__body .btn-block {
    padding: 6.2% 0 0;
}
.section-item .content-block-item-3 .content-block__body .btn-block .btn {
    padding-left: 10px;
    margin: 0 14px;
}
.section-item .content-block-item-3 .content-block__body .btn-block .btn:first-child {
    padding-top: 20px;
}
.section-item .content-block-item-3 .content-block__body .btn-block .btn.btn-animate i {
    margin-left: 10px;
}









/* ************ uchi 追加分 こだわり **************** */



/* section-about */
.section-about {
    padding: 0 0 0;
    background-color: #f8f2e3;
}


.section-about .section__header .content-block {
    margin-left: -3.3%;
}
.section-about .section__header .content-block__body {
    max-width: 172px;
    padding: 6.4% 0 4.5%;
}

.section-about .section__body .content-block-item-1 {
    margin-left: -9.7%;
    margin-bottom: 3.2%;
}
.section-about .section__body .content-block-item-1 .content-block__body {
    max-width: 1025px;
}

.section-about .section__body .content-block-item-2 {
    margin-bottom: 5.9%;
}
.section-about .section__body .content-block-item-2 .content-block__body {
    max-width: 850px;
}

.section-about .section__body .content-block-item-3 {
    margin-left: 2.2%;
}
.section-about .section__body .content-block-item-3 .content-block__body {
    max-width: 1160px;
}

.section-about .section__body .content-block-item-4 {
    margin-top: -2.8%;
	margin-left: -6%;
	margin-bottom: 4.4%;
}
.section-about .section__body .content-block-item-4 .content-block__body {
    max-width: 872px;
}

.section-about .section__body .content-block-item-5 {
	margin-left: 0;
	margin-bottom: 8.2%;
}
.section-about .section__body .content-block-item-5 .content-block__body {
    max-width: 1090px;
}

.section-about .section__body .content-block-item-6 {
	margin-right: 5.5%;
	margin-bottom: 4.4%;
}
.section-about .section__body .content-block-item-6 .content-block__body {
/*    max-width: 1700px;*/
}

.section-about .section__body .content-block-item-7 {
	margin-left: 3.3%;
	padding-bottom: 5.9%;
}
.section-about .section__body .content-block-item-7 .content-block__body {
    max-width: 820px;
}




/* ************ uchi 追加分 穀潤RED **************** */

.section__kokujun_red {
    position: relative;
    background-image: url('../img/bg_pink.png');
    background-size: 100%;
    background-repeat: repeat-y;
    padding: 4% 0 5.6%;
}
.section__kokujun_red .content-block .content-block__body {
    max-width: 980px;
}
.section__kokujun_red .content-block .content-block__body .cols__block-1 {
    max-width: 371px;
    margin: 0.8% 0 0 7.7%;
}

.section__kokujun_red .content-block .content-block__body .cols__block-2 {
    max-width: 459px;
    margin: 8.7% 0 0 -3.6%;
}
.section__kokujun_red .content-block .content-block__body .btn-block {
    padding: 6.1% 0 0 0;
    text-align: left;
}
.section__kokujun_red .content-block .content-block__body .btn-block .btn {
	margin: 0;
}

.section__kokujun_red .content-block.content-block-item-1 {
    margin: 2.1% 0 0 1.1%;
}
.section__kokujun_red .content-block.content-block-item-1 .content-block__body {
    max-width: 760px;
    background: #fff;
}

.accordion h3 {
	color: #432107;
	font-size: 1.2em;
    padding-top: 1.5%;
    padding-bottom: 1.5%;
    letter-spacing: 0.15em;
    padding-right: 3%;
    font-weight: bold;
}
.accordion h3:hover {
    cursor: pointer;
}

.accordion .accordion-target > div{
	padding: 3.2% 6.6% 4%;
}

.accordion .accordion-target table tr {
	border-top: 1px solid #BEAD9C;
	border-bottom: 1px solid #BEAD9C;
}
.accordion .accordion-target table tr th,td {
	height: 70px;
	vertical-align: middle;
	text-align:	left;
}
.accordion .accordion-target table tr th {
	background: #DED6CC;
    font-weight: bold;
	padding-left: 4%;
	width: 27.4%;
}
.accordion .accordion-target table tr td {
	padding-left: 4.6%;
}

.accordion .accordion-target table tr td.detail {
	padding-top: 16px;
	padding-bottom: 18px;
    font-size: 0.9em;
    line-height: 1.91em;
}


.accordion .accordion-target ul {
	padding-top: 12px;
}
.accordion .accordion-target ul li {
	text-align:	left;
	line-height: 1.8em;
}




/* ************ uchi 追加分 穀潤Yellow **************** */

.section__kokujun_yellow {
    position: relative;
    background-image: url('../img/bg_yellow.png');
    background-size: 100%;
    background-repeat: repeat-x;
    padding: 4% 0 6.3%;
}
.section__kokujun_yellow .content-block .content-block__body {
    max-width: 980px;
}
.section__kokujun_yellow .content-block .content-block__body .cols__block-1 {
    max-width: 371px;
    margin: 2% 0 0 5.5%;
}

.section__kokujun_yellow .content-block .content-block__body .cols__block-2 {
    max-width: 429px;
    margin: 9.1% 0 0 -1.5%;
}
.section__kokujun_yellow .content-block .content-block__body .btn-block {
    padding: 8% 0 0 0;
    text-align: left;
}
.section__kokujun_yellow .content-block .content-block__body .btn-block .btn {
	margin: 0;
}

.section__kokujun_yellow .content-block.content-block-item-1 {
    margin: 2% 0 0 1%;
}
.section__kokujun_yellow .content-block.content-block-item-1 .content-block__body {
    max-width: 760px;
    background: #fff;
}


.section__kokujun_yellow .content-block.content-block-item-2 {
	margin-top: 6%;
	margin-left: 5.5%;
}
.section__kokujun_yellow .content-block.content-block-item-2 .content-block__body {
	max-width: 100%;
/*    max-width: 1700px;*/
}

.section__kokujun_yellow .content-block.content-block-item-3 {
    margin: 0 0 0 -4.7%;
    background: #fff;
    padding-bottom: 1.4%;
}
.section__kokujun_yellow .content-block.content-block-item-3 .content-block__body {
    max-width: 792px;
}




.section-shop {
	margin: 0 auto;
    background-image: url('../img/pic_shop_bg.png');
    background-size: cover;
    background-position: center;
}

.section-shop .shop {
	max-width:		600px;
	margin:		0 auto 0;
/*	margin:		-46.4% auto 0;*/
	padding:	20.3% 0 22%;
}

.section-shop .shop .shop_products{
	max-width:		482px;
	margin:		0 0 1% 12%;
}
.section-shop .shop .btn-block {
	margin-left:	-2%;
}

.section-shop .content-block .content-block__body .btn-block .btn {
	margin: 0;
}
/* ************ uchi 追加分 end **************** */








.section-about .section__body {
    padding: 0 0 0;
/*    max-width: 980px;*/
    margin: 0 auto;
}
.section-about p {
    text-align: center;
    font-size: 2.2rem;
    font-weight: bold;
    line-height: 1.7;
    padding: 0;
    display: block;
}
.section-about p strong {
    color: #b81119;
}
.section-about p .sup {
    font-size: 1.7rem;
}
.section-about .point-list {
    padding: 7.8% 0 0;
}
.section-about .point-list li {
    margin: 10px 0 0;
}
.section-about .point-list li:first-child {
    margin-top: 0;
}

/* section-footer */
.section__footer {
    padding: 0 0 5.6%;
}
.section__footer .nav-tab {
    padding: 14px 0 0;
}
.section__footer .btn-block {
    padding: 4.2% 0 0;
}

/* section-link */
.section__link {
    position: relative;
    background-color: #221a31;
    padding: 4% 0;
}
.section__link .content-block .content-block__body {
    width: 1080px;
}
.section__link .content-block .content-block__body .cols__block-2 {
    padding: 0 0 0 1.5%;
}
.section__link .content-block .content-block__body .btn-block {
    padding: 6.1% 0 0 7px;
    text-align: left;
}






footer {
    padding: 4% 0;
    text-align: center;
}
footer .copyright {
    font-size: 0.85rem;
    letter-spacing: 1px;
}









@media only screen and (max-width:1600px) {
	.section__kokujun_yellow {
	    background-size: 120%;
	}

}

@media only screen and (max-width:1300px) {
	.section__kokujun_yellow {
	    background-size: 150%;
	}
}


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

    html {
        font-size: 13px;
    }


	.link_instagram {
		top: 20px;
		right: 20px;
	}
	.link_instagram a{
		font-size: 30px;
		padding-top: 15px;
		width: 60px;
		height: 60px;
	}

	.link_instagram_footer a{
		margin: 0 auto 1%;
	}

	.section__kokujun_yellow {
	    background-size: 80%;
	}

	.btn-block .btn {
		min-width: 288px;
		width: 100%;
		max-width: 337px;
		height: 80px;
	}

	header {
	    padding: 0 0 7.4%;
	}
	.top_message {
		max-width: 100%;
	    width: 73%;
	    margin: -23.2% auto 0;
	}

	.top_message2 {
	    width: 62%;
	    margin: 5.3% auto 0 20%;
	}

	.section-item .content-block-item-1 {
	    margin-left: 5.2%;
	}

	.section-item .content-block-item-2 {
	    padding: 12.6% 0 6.3%;
	}
	.section-item#section-item-1 .content-block.content-block-item-2 .content-block__body {
	    width: 74%;
	}


	.section-item .content-block-item-3 {
	    padding: 0 0 9%;
	}
	.section-item#section-item-1 .content-block.content-block-item-3 .content-block__body {
	    width: 90%;
	}
	.section-item .content-block-item-3 .content-block__body .btn-block {
	    padding: 3.8% 0 0;
	}

	.section-item .content-block-item-3 .content-block__body .btn-block .btn {
	    padding-left: 10px;
	    margin: 0 auto;
	    letter-spacing: 0.19em;
	    line-height:	1.7rem;
	}
	.section-item .content-block-item-3 .content-block__body .btn-block .btn span.reference {
		font-size:	0.8em;
	}
	.section-item .content-block-item-3 .content-block__body .btn-block .btn:first-child {
	    padding-top: 18px;
	}
	.section-item .content-block-item-3 .content-block__body .btn-block .btn:last-child {
		margin-top: 5px;
		padding-top:	28px;
		letter-spacing: 0.14em;

	}



	.section-about .section__header .content-block {
	    margin: 0 auto;
	}
	.section-about .section__header .content-block__body {
		max-width: 100%;
		width: 34%;
	    padding: 10.3% 0 8%;
	    margin: 0 auto 0 27%;
	}
	.section-about .section__body .content-block-item-1 {
	    margin: 0 auto 9.2%;
	}
	.section-about .section__body .content-block-item-1 .content-block__body {
	    width: 90%;
	}

	.section-about .section__body .content-block-item-2 .content-block__body {
	    width: 90%;
	}
	.section-about .section__body .content-block-item-2 {
	    margin-bottom: 10%;
	}


	.section-about .section__body .content-block-item-3 {
	    margin: 0 auto 10.3%;
	}
	.section-about .section__body .content-block-item-3 .content-block__body {
	    width: 91%;
	}


	.section-about .section__body .content-block-item-4 {
		margin: 0 auto 10.4%;
	}
	.section-about .section__body .content-block-item-4 .content-block__body {
	    width: 98%;
	}




	.section-about .section__body .content-block-item-5 {
	    margin-bottom: 9%;
	}
	.section-about .section__body .content-block-item-5 .content-block__body {
	    width: 90%;
	}


	.section-about .section__body .content-block-item-6 {
	    margin-right: 5%;
	    margin-bottom: 6%;
	}

	.section-about .section__body .content-block-item-7 {
	    margin: 0 auto 0;
	    padding-bottom: 18%;
	}
	.section-about .section__body .content-block-item-7 .content-block__body {
	    width: 84.5%;
	    margin-left: 5%;
		max-width: 100%;
	}


	.cols {
	    display: block;
	}

	.section__kokujun_red {
	    background-image: url(../img/sp/bg_pink.png);
	    padding: 0 0 11.4%;
	}




	.section__kokujun_red .content-block .content-block__body .cols__block-1 {
		margin: 0 0 0 0;
	    width: 92%;
		max-width: 100%;
	    padding: 11% 0 0 18%;
	}


	.section__kokujun_red .content-block .content-block__body .cols__block-2 {
	    margin: 0 0 0 0;
		max-width: 100%;
	}
	.section__kokujun_red .content-block .content-block__body .cols__block-2 .pic-block {
	    margin: 7.4% 0 0 12%;
	    width: 76%;
	}
	.section__kokujun_red .content-block .content-block__body .btn-block {
	    padding: 6% 0 0 0;
	    text-align:	center;
		max-width: 100%;
	}


	.btn-block .btn.btn-orange {
	   padding-top: 27px;
	   width: 90%;
	}




	.section__kokujun_red .content-block.content-block-item-1 {
	    margin: 0.1% 0 0 0;
	}
	.section__kokujun_red .content-block.content-block-item-1 .content-block__body {
	    width: 89.8%;
		max-width: 100%;
	}





	.section__kokujun_yellow {
	    background-image: url(../img/sp/bg_yellow.png);
	    padding: 0 0 0;
	}

	.section__kokujun_yellow .content-block .content-block__body .cols__block-1 {
		margin: 0 0 0 0;
		width: 88%;
		max-width: 100%;
    	padding: 12.4% 0 0 14%;
	}


	.section__kokujun_yellow .content-block .content-block__body .cols__block-2 {
	    margin: 0 0 0 0;
		max-width: 100%;
	}
	.section__kokujun_yellow .content-block .content-block__body .cols__block-2 .pic-block {
	    margin: 7% auto 0 20%;
	    width: 60.2%;
	}
	.section__kokujun_yellow .content-block .content-block__body .btn-block {
	    padding: 6% 0 0 0;
	    text-align:	center;
	}
	.section__kokujun_yellow .content-block.content-block-item-1 {
	    margin: 0.1% 0 0;
	}
	.section__kokujun_yellow .content-block.content-block-item-1 .content-block__body {
	    width:	90%;
		max-width: 100%;
	}

	.section__kokujun_yellow .content-block.content-block-item-2 {
	    margin-top: 13%;
	    margin-left: 5%;
	}


	.section__kokujun_yellow .content-block.content-block-item-3 {
	    margin: 10% 0 0 0;
	    padding-bottom: 16%;
	}
	.section__kokujun_yellow .content-block.content-block-item-3 .content-block__body {
	    width: 96%;
	}



	.section-shop {
	    background-image: url(../img/sp/pic_shop_bg.png);
	}



	.section-shop .shop .shop_products {
	    margin: 0 auto 0;
	    width:	78%;
		max-width: 100%;
	}

	.section-shop .shop {
	    padding: 50% 0 29%;
		max-width: 100%;
	}


	.section-shop .shop .btn-block {
	     margin-left: auto;
	}
}


@media only screen and (max-width:700px) {
    html {
        font-size: 12px;
    }
    .btn-block .btn {
    	font-size: 13px;
    }

	.section__kokujun_yellow {
	    background-size: 90%;
	}
}

@media only screen and (max-width:414px) {
    html {
        font-size: 12px;
    }
    .btn-block .btn {
    	font-size: 13px;
    }

	.section__kokujun_yellow {
	    background-size: 100%;
	}
}

@media only screen and (max-width:375px) {
    html {
        font-size: 11px;
    }

    .btn-block .btn.btn-orange {
    	font-size: 13px;
    }

	.section__kokujun_yellow {
	    background-size: 100%;
	}
}

@media only screen and (max-width:375px) {
    html {
        font-size: 11px;
    }

    .btn-block .btn {
    	font-size: 12px;
    }
    .btn-block .btn.btn-orange {
    	font-size: 13px;
    }

	.section__kokujun_yellow {
	    background-size: 100%;
	}
}