@charset "UTF-8";

html[data-browse-mode="P"] .for-sp { display: none !important;}
html[data-browse-mode="S"] .for-pc { display: none !important;}
html[data-browse-mode="P"] .pane-main { color: #443829; font-size: 20px;}
html[data-browse-mode="S"] .pane-main { color: #443829; font-size: 18px;}

html[data-browse-mode="P"] h2.ttl-green { padding: 0; margin: 0 0 30px 0; text-align: center; background: url(../img/ttl_green.png) center top no-repeat; -webkit-background-size: 100% 100%; background-size: 100% 100%; color: #fff;}
html[data-browse-mode="P"] h3.ttl-yellow-green { padding: 0; margin: 0 0 30px 0; font-weight: bold; text-align: center; background: url(../img/ttl_yellow_green.png) center top no-repeat; -webkit-background-size: 100% 100%; background-size: 100% 100%; color: #443829;}
html[data-browse-mode="S"] h2.ttl-green { padding: 0; margin: 0 0 30px 0; text-align: center; background: url(../img/ttl_green_sp.png) center top no-repeat; -webkit-background-size: 100% 100%; background-size: 100% 100%; color: #fff;}
html[data-browse-mode="S"] h3.ttl-yellow-green { padding: 0; margin: 0 0 30px 0; font-weight: bold; text-align: center; background: url(../img/ttl_yellow_green_sp.png) center top no-repeat; -webkit-background-size: 100% 100%; background-size: 100% 100%; color: #443829;}
html[data-browse-mode="P"] h3.ttl-design-line { padding: 0; margin: 0 0 30px 0; font-weight: bold; text-align: center; background: url(../img/ttl_line.png) center center repeat-x; -webkit-background-size: 100px 8px; background-size: 100px 8px; color: #443829;}
html[data-browse-mode="P"] h3.ttl-design-line .bg { padding: 0 24px; margin: 0 auto; display: inline-block; background: #fff;}
html[data-browse-mode="S"] h3.ttl-design-line { padding: 0; margin: 20px 10px; font-weight: bold; text-align: center; background: url(../img/ttl_line.png) center center repeat-x; -webkit-background-size: 40px 4px; background-size: 40px 4px; color: #443829;}
html[data-browse-mode="S"] h3.ttl-design-line .bg { padding: 0 18px; margin: 0 auto; display: inline-block; background: #fff;}
.negi-bouzu h3.ttl-design-line .bg { background: #d7ede1 !important;}
h3.ttl-design-line .kome { font-size: 12px; vertical-align: top;}
h3.ttl-yellow-green::after,
h3.ttl-design-line::after { border: none; display: none !important;}
html[data-browse-mode="P"] h2.ttl-green { height: 100px; font-size: 40px; line-height: 106px;}
html[data-browse-mode="P"] h3.ttl-yellow-green { height: 80px; line-height: 84px; font-size: 32px;}
html[data-browse-mode="P"] h3.ttl-yellow-green .small { margin-right: 10px; font-size: 28px; letter-spacing: -1px;}
html[data-browse-mode="P"] h3.ttl-design-line  { font-size: 30px;}
html[data-browse-mode="S"] h2.ttl-green { font-size: 24px; padding: 20px 10px 18px;}
html[data-browse-mode="S"] h3.ttl-yellow-green { padding: 10px; margin: 30px 10px 15px;}
html[data-browse-mode="S"] #push01 h3.ttl-yellow-green,
html[data-browse-mode="S"] #push02 h3.ttl-yellow-green,
html[data-browse-mode="S"] #push03 h3.ttl-yellow-green { padding: 15px 10px 12px calc(30% + 20px); margin: 30px 10px 15px;}
html[data-browse-mode="S"] h3.ttl-yellow-green .small { font-size: 16px; text-align: center; display: block;}
html[data-browse-mode="S"] h3.ttl-design-line  { font-size: 18px;}
.yg-frame { padding: 0 0 1px 0; margin: 0 -10px; background: url("../img/bg01.png") center top no-repeat; -webkit-background-size: 100% 100%; background-size: 100% 100%;}
.negi-bouzu { padding: 0 0 1px 0; background: url("../img/bg02.png") center top no-repeat; -webkit-background-size: 100% 100%; background-size: 100% 100%;}
.go-color-list li { padding-left: 1em; letter-spacing: -1px; position: relative;}
.go-color-list li::before { content: '●'; font-size: 10px; color: #3e9d69; display: inline; position: absolute; left: 0; top: 0.8em;}


/* PC
----------------------------*/
@media only screen and (min-width: 897px) {
  .event-bottom-banners ul { display: flex; flex-wrap: wrap; justify-content: space-between;}
  .event-bottom-banners ul li { width: 49%; margin: 0 0 20px;}
	.special-intro.color-green .special-anchor-links .child { border-color: #7baa17; color: #fff; background: #7baa17 url(../../common/img/ar_down_white.png) no-repeat 95%;}
	
	.pane-main .ttl { font-size: 24px; font-weight: bold;}
	.pane-main .text + .text { margin-top: 20px;}
	.pane-main .flex-frame { display: flex; justify-content: space-between;}
	.green-btn-other { margin: 0 0 50px 0; text-align: center;}
	.green-btn-other a { width: 440px; padding: 15px 20px; margin: 0 auto; border: #3e9d69 2px solid; border-radius: 60px; text-align: center; font-size: 20px; font-weight: bold; text-decoration: none; color: #3e9d69; background: #fff; box-sizing: border-box; display: block; position: relative;}
	.green-btn-other a::after { content: ''; width: 12px; height: 12px; border-top: #3e9d69 2px solid; border-right: #3e9d69 2px solid; -webkit-transform: rotate(45deg); transform: rotate(45deg); position: absolute; right: 30px; top: calc(50% - 6px);}
	.green-btn-big { margin: 0 0 50px 0; text-align: center;}
	.green-btn-big a { width: 440px; padding: 15px 20px; margin: 0 auto; border: #3e9d69 2px solid; border-radius: 60px; text-align: center; font-size: 20px; font-weight: bold; text-decoration: none; color: #3e9d69; background: #fff; box-sizing: border-box; display: block; position: relative;}
	.green-btn-big a::before { content: ''; width: 10px; height: 10px; border-top: #3e9d69 2px solid; border-right: #3e9d69 2px solid; -webkit-transform: rotate(135deg); transform: rotate(135deg); position: absolute; right: 30px; top: calc(50% - 12px);}
	.green-btn-big a::after { content: ''; width: 10px; height: 10px; border-top: #3e9d69 2px solid; border-right: #3e9d69 2px solid; -webkit-transform: rotate(135deg); transform: rotate(135deg); position: absolute; right: 30px; top: calc(50% - 4px);}

	/* ABOUT */
	#go_about .flex-frame { padding: 0 40px; margin: 0 0 40px 0;}
	#go_about .flex-frame .image { width: 360px;}
	#go_about .flex-frame .name  { margin: 10px 0 0 0; font-weight: bold; text-align: center;}
	#go_about .flex-frame .desc  { width: 420px;}
	#go_about .flex-frame strong { border-bottom: #443829 1px solid; font-weight: bold;}
	/* EAT */
	#go_eat .howto { padding: 0 40px;}
	#go_eat .howto .image { width: 410px;}
	#go_eat .howto .desc  { width: 380px;}
	#go_eat .howto .desc #box01 { margin: 0 0 30px 0;}
	#go_eat .howto .desc #box02 { margin: 0 0 50px 0;}
	#go_eat .howto .desc #box03 { margin: 0 0 55px 0;}
	#go_eat .negi-bouzu { padding: 30px 20px 45px; margin: 40px 30px;}
	#go_eat .negi-bouzu h3.ttl-design-line { margin: 0 0 15px 0;}
	#go_eat .negi-bouzu .bouzu { margin: 0 20px;}
	#go_eat .negi-bouzu .bouzu .image  { width: 370px;}
	#go_eat .negi-bouzu .bouzu .desc   { width: 360px;}
	#go_eat .negi-bouzu .bouzu + .text { margin: 20px 20px 0;}
	/* PUSH */
	#go_push { margin: 80px 0 0 0;}
	#go_push .ttl-select3 { margin: 0 0 30px 0; text-align: center;}
	.push-box .ttl-yellow-green .inner { padding-left: 90px; line-height: 1.0; display: inline-block; position: relative;}
	.push-box .ttl-yellow-green .pop   { position: absolute; top: -50px; left: -20px;}
	.push-box .ttl-yellow-green .white { padding: 10px 0; line-height: 1.0; display: inline-block; background: url("../img/white.png") center bottom no-repeat; -webkit-background-size: 100% auto; background-size: 100% auto;}
	#push01 .ttl-yellow-green .pop { width: 97px;}
	#push02 { margin-top: 80px;}
	#push02 .ttl-yellow-green .pop { width: 97px;}
	#push03 { margin-top: 80px;}
	#push03 .ttl-yellow-green { letter-spacing: -2px;}
	#push03 .ttl-yellow-green .pop { width: 105px;}
	.push-box .flex-frame { margin: 0 0 40px 0; align-items: center;}
	.push-box .flex-frame .image { width: 480px;}
	.push-box .flex-frame .desc  { width: 380px;}
	.push-box .flex-frame .desc .go-color-list { margin: 0 0 10px;}
	/* HOWTO */
	#go_howto { margin: 80px 0 0 0;}
	#go_howto .howto-box  { margin: 0 0 50px 0;}
	#go_howto .flex-frame { align-items: center;}
	#go_howto .flex-frame .image { width: 430px;}
	#go_howto .flex-frame .desc  { width: 430px;}
	#go_howto .point-frame { padding: 30px 50px; margin: 40px 0 0 60px; background: #f0f1d7; position: relative;}
	#go_howto .point-frame::before { content: ''; width: 135px; height: 59px; background: url("../img/point.png") left top no-repeat; -webkit-background-size: 135px 59px; background-size: 135px 59px; display: block; position: absolute; top: -24px; left: -60px;}
	#howto01 .flex-frame,
	#howto03 .flex-frame,
	#howto05 .flex-frame,
	#howto07 .flex-frame,
	#howto09 .flex-frame { flex-direction: row-reverse;}
	/* CALENDAR */
	#go_comp .ttl-design-line { margin-bottom: 15px;}
	#go_comp .table-frame { margin: 0 0 50px 0; display: flex; justify-content: space-between;}
	#go_comp .table-header { width: 140px; text-align: left; line-height: 1.2;}
	#go_comp .table-contents { width: calc(100% - 140px); text-align: center; line-height: 1.2;}
	#go_comp .table-frame table { width: 100%; border: #dbe3df 1px solid; border-collapse: collapse;}
	#go_comp .table-frame table td { padding: 10px; min-width: 90px; vertical-align: middle; border: #dbe3df 1px solid; border-collapse: collapse;}
	#go_comp .line01 td,
	#go_comp .line01-1 td,
	#go_comp .line01-2 td { background: #ebf3ef}
	#go_comp .line02 td { background: #f7fefb;}
	#go_comp .line03 td { background: #ffffff;}
	#go_comp .line04 td { background: #f7fefb;}
	#go_comp .line01 td { padding: calc(20.5px + 1.2em) 10px !important;}
	#go_comp .calendar-ttl { margin: 0 0 20px 0; text-align: center; color: #3e9d69;}
	#go_comp .calendar-ttl .y-green { padding: 10px 0; margin-left: 40px; font-size: 40px; font-weight: bold; line-height: 1.0; display: inline-block; background: url("../img/yellow_green.png") center bottom no-repeat; -webkit-background-size: 100% auto; background-size: 100% auto;}
	#go_comp .calendar-frame { margin: 0 0 50px 0;}
	#go_comp .calendar-box { margin: 0 0 20px 0;}
	#go_comp .calendar-frame-header { width: 100%; padding: 20px 0; margin: 20px 0 30px; border: #ebf3ef 5px solid; display: flex; justify-content: space-between; align-items: center; position: relative;}
	#go_comp .calendar-frame-header .box { padding: 0 15px;}
	#go_comp .calendar-frame-header .box .list-ttl { text-align: center; font-weight: bold;}
	#go_comp .calendar-frame-header .box .list li  { font-weight: bold;}
	#go_comp .calendar-frame-header .box:nth-child(1) { width: 32%;}
	#go_comp .calendar-frame-header .box:nth-child(2) { width: 38%; border-left: #ebf3ef 2px solid; border-right: #ebf3ef 2px solid;}
	#go_comp .calendar-frame-header .box:nth-child(3) { width: 30%;}
	#go_comp .calendar-frame-header .box:nth-child(1) .list-ttl { position: relative; top: -60px;}
	#go_comp .calendar-frame-header .box:nth-child(1) .mark     { padding: 0 10px; position: relative; top: 12px;}
	#go_comp .calendar-frame-header .box:nth-child(3) .list-ttl { position: relative; top: -80px;}
	#calendar01 .pop { width: 97px;}
	#calendar02 .pop { width: 97px;}
	#calendar03 .pop { width: 105px;}
	/* FAQ */
	.faq-box { margin: 0 0 50px 0;}
	.faq-box dt { padding: 0 0 0 50px; margin: 0 0 30px 0; background: url("../img/q.png") left top no-repeat; -webkit-background-size: 32px 30px; background-size: 32px 30px; font-weight: bold;}
	.faq-box dd { padding: 0 0 0 50px; display: flex; justify-content: space-between; flex-direction: row-reverse; background: url("../img/a.png") left top no-repeat; -webkit-background-size: 32px 30px; background-size: 32px 30px;}
	.faq-box dd .image { width: 320px;}
	.faq-box dd .desc  { width: 480px;}
	.faq-box dd .memo  { padding-left: 1em; margin-top: 20px; text-indent: -1em; font-size: 14px;}
	
	#push01_wrap .block-goods-list-d--item-description .block-goods-list-d--item-details + .block-goods-list-d--item-details { display: none;}
	#push02_wrap .block-goods-list-d--item-description .block-goods-list-d--item-details + .block-goods-list-d--item-details { display: none;}
	#push03_wrap .block-goods-list-d--item-description .block-goods-list-d--item-details + .block-goods-list-d--item-details { display: none;}
	#lineup01_wrap .block-goods-list-d--item-description .block-goods-list-d--item-details + .block-goods-list-d--item-details { display: none;}
	#lineup02_wrap .block-goods-list-d--item-description .block-goods-list-d--item-details + .block-goods-list-d--item-details { display: none;}
	#lineup03_wrap .block-goods-list-d--item-description .block-goods-list-d--item-details + .block-goods-list-d--item-details { display: none;}
	/*
	#lineup01_wrap ul.block-goods-list-d--items li + li { display: none;}
	#lineup02_wrap ul.block-goods-list-d--items li + li { display: none;}
	#lineup03_wrap ul.block-goods-list-d--items li + li { display: none;}
	*/
	#go_comp .block-goods-list-d--item-description .block-goods-list-d--item-details + .block-goods-list-d--item-details { display: none;}
}

/* SP
----------------------------*/
@media only screen and (max-width: 896px) {
  .event-bottom-banners { margin: 4vw; }
  .event-bottom-banners ul li:not(:last-child) { margin: 0 0 10px;}
	.special-intro.color-green .special-anchor-links .child { border-color: #7baa17; color: #fff; background: #7baa17 url(../../common/img/ar_down_white.png) no-repeat 95%;}
	
	.wrapper { max-width: 100vw; overflow-x: hidden;}
	#green_onion { padding: 0 10px;}
	.pane-main .ttl { font-size: 20px; font-weight: bold;}
	.pane-main .text + .text { margin-top: 15px;}
	.green-btn-other { margin: 15px 0 40px 0; text-align: center;}
	.green-btn-other a { width: calc(100% - 20px); padding: 15px 20px; margin: 0 auto; border: #3e9d69 2px solid; border-radius: 60px; text-align: center; font-size: 18px; font-weight: bold; text-decoration: none; line-height: 1.0; letter-spacing: -1px; color: #3e9d69; background: #fff; box-sizing: border-box; display: block; position: relative;}
	.green-btn-other a::after { content: ''; width: 10px; height: 10px; border-top: #3e9d69 2px solid; border-right: #3e9d69 2px solid; -webkit-transform: rotate(45deg); transform: rotate(45deg); position: absolute; right: 20px; top: calc(50% - 5px);}
	.green-btn-big { margin: 15px 0 40px 0; text-align: center;}
	.green-btn-big a { width: calc(100% - 20px); padding: 16px 20px; margin: 0 auto; border: #3e9d69 2px solid; border-radius: 60px; text-align: center; font-size: 18px; font-weight: bold; text-decoration: none; line-height: 1.0; color: #3e9d69; background: #fff; box-sizing: border-box; display: block; position: relative;}
	.green-btn-big a::before { content: ''; width: 8px; height: 8px; border-top: #3e9d69 2px solid; border-right: #3e9d69 2px solid; -webkit-transform: rotate(135deg); transform: rotate(135deg); position: absolute; right: 20px; top: calc(50% - 10px);}
	.green-btn-big a::after { content: ''; width: 8px; height: 8px; border-top: #3e9d69 2px solid; border-right: #3e9d69 2px solid; -webkit-transform: rotate(135deg); transform: rotate(135deg); position: absolute; right: 20px; top: calc(50% - 2px);}

	/* ABOUT */
	#go_about .flex-frame { padding: 0 20px; margin: 0 0 40px 0;}
	#go_about .flex-frame.about00 { margin: 0 0 15px 0; display: flex; justify-content: space-between;}
	#go_about .flex-frame .image { width: calc(50% - 1px); text-align: center;}
	#go_about .flex-frame .name  { margin: 10px 0 0 0; font-size: 14px; font-weight: bold; text-align: center;}
	#go_about .flex-frame .desc  {}
	#go_about .flex-frame strong { border-bottom: #443829 1px solid; font-weight: bold;}
	/* EAT */
	#go_eat .howto { padding: 0 20px;}
	#go_eat .howto .image { margin: 0 0 15px 0; text-align: center;}
	#go_eat .howto .desc .box { margin: 0 0 30px 0;}
	#go_eat .negi-bouzu { padding: 20px 15px 30px; margin: 20px 15px;}
	#go_eat .negi-bouzu h3.ttl-design-line { margin: 0 0 15px;}
	#go_eat .negi-bouzu .bouzu .image  { margin: 0 0 15px 0; text-align: center;}
	#go_eat .negi-bouzu .bouzu + .text { margin: 15px 0 0;}
	#green_onion #go_eat .ttl { padding-left: 30px;}
	#green_onion #go_eat #box01 .ttl { background: url("../img/no_a.png") left center no-repeat; -webkit-background-size: 23px 20px; background-size: 23px 20px;}
	#green_onion #go_eat #box02 .ttl { background: url("../img/no_b.png") left center no-repeat; -webkit-background-size: 23px 20px; background-size: 23px 20px;}
	#green_onion #go_eat #box03 .ttl { background: url("../img/no_c.png") left center no-repeat; -webkit-background-size: 23px 20px; background-size: 23px 20px;}
	#green_onion #go_eat #box04 .ttl { background: url("../img/no_d.png") left center no-repeat; -webkit-background-size: 23px 20px; background-size: 23px 20px;}
	/* PUSH */
	#go_push { margin: 50px 0 0 0;}
	#go_push h2.ttl-green { margin: 0 -10px 10px !important;}
	#go_push .ttl-select3 { margin: 0 15px 30px; text-align: center;}
	.push-box .ttl-yellow-green .inner { line-height: 1.4;}
	.push-box .ttl-yellow-green .pop   { width: 28%; height: auto; position: absolute; top: -5px; left: 20px;}
	.push-box .ttl-yellow-green .white { padding: 8px 0; line-height: 1.0; display: inline-block; background: url("../img/white.png") center bottom no-repeat; -webkit-background-size: 100% auto; background-size: 100% auto;}
	#push02 { margin-top: 80px;}
	#push03 { margin-top: 80px;}
	.push-box .flex-frame { margin: 0 15px 40px; align-items: center;}
	.push-box .flex-frame .image { margin: 0 0 15px 0; text-align: center;}
	.push-box .flex-frame .desc .go-color-list { margin: 0 0 10px;}
	/* HOWTO */
	#go_howto { margin: 50px 0 0 0;}
	#go_howto .howto-box  { margin: 0 0 30px 0;}
	#go_howto .flex-frame { align-items: center;}
	#go_howto .flex-frame .image { margin: 0 15px 15px; text-align: center;}
	#go_howto .flex-frame .desc  { margin: 0 15px;}
	#go_howto .point-frame { padding: 30px 20px 15px; margin: 40px 15px 0; background: #f0f1d7; position: relative;}
	#go_howto .point-frame::before { content: ''; width: 100px; height: 44px; background: url("../img/point.png") left top no-repeat; -webkit-background-size: 100px auto; background-size: 100px auto; display: block; position: absolute; top: -24px; left: 0;}
	/* CALENDAR */
	#go_comp .ttl-design-line { margin-bottom: 15px;}
	#go_comp .table-frame { padding: 0 0 0 10px; margin: 0 0 30px 0; display: flex; justify-content: space-between; position: relative;}
	#go_comp .table-frame .scroll-att { width: 100%; padding: 10px 0; text-align: center; background-color: #fff; position: absolute; top: 35%; left: 0; opacity: .7;}
	#go_comp .table-frame .scroll-att img { width: 60%; vertical-align: top;}
	#go_comp .table-header { width: 120px; text-align: left; line-height: 1.2;}
	#go_comp .table-contents { width: calc(100% - 120px); overflow-x: scroll; text-align: center; line-height: 1.2;}
	#go_comp .table-frame table { width: 100%; border: #dbe3df 1px solid; border-collapse: collapse;}
	#go_comp .table-frame table td { padding: 10px; min-width: 100px; border: #dbe3df 1px solid; border-collapse: collapse; word-break: keep-all; font-size: 16px; vertical-align: middle;}
	#go_comp .line01 td,
	#go_comp .line01-1 td,
	#go_comp .line01-2 td { background: #ebf3ef}
	#go_comp .line02 td { background: #f7fefb;}
	#go_comp .line03 td { background: #ffffff;}
	#go_comp .line04 td { background: #f7fefb;}
	#go_comp .line01 td { padding: calc(20.5px + 1.2em) 10px !important;}
	#go_comp .calendar-ttl { margin: 0 0 20px 0; text-align: center; color: #3e9d69; position: relative;}
	#go_comp .calendar-ttl .y-green { padding: 8px 0; font-size: 26px; font-weight: bold; line-height: 1.0; display: inline-block; background: url("../img/yellow_green.png") center bottom no-repeat; -webkit-background-size: 100% auto; background-size: 100% auto;}
	#go_comp .calendar-frame { margin: 0 10px 50px;}
	#go_comp .calendar-box { margin: 0 0 20px 0;}
	#go_comp .calendar-box .pop { width: 70px; height: auto; position: relative; left: -15px;}
	#go_comp .indent-list { margin: 20px 15px;}
	#go_comp .indent-list li { padding-left: 1em; text-indent: -1em;}
	#go_comp .calendar-frame-header { margin: 20px 10px 30px; padding: 0 15px; border: #ebf3ef 5px solid; position: relative;}
	#go_comp .calendar-frame-header .box { padding: 15px;}
	#go_comp .calendar-frame-header .box .list-ttl { margin-bottom: 15px; text-align: center; font-weight: bold;}
	#go_comp .calendar-frame-header .box .list li  { font-weight: bold;}
	#go_comp .calendar-frame-header .box:nth-child(1) { padding: 15px 50px 30px;}
	#go_comp .calendar-frame-header .box:nth-child(2) { border-top: #ebf3ef 2px solid; border-bottom: #ebf3ef 2px solid;}
	/* FAQ */
	.faq-box { margin: 0 15px 30px;}
	.faq-box dt { padding: 0 0 0 40px; margin: 0 0 30px 0; background: url("../img/q.png") left top no-repeat; -webkit-background-size: 28px auto; background-size: 28px auto; font-weight: bold;}
	.faq-box dd { padding: 0 0 0 40px; background: url("../img/a.png") left top no-repeat; -webkit-background-size: 28px auto; background-size: 28px auto; display: flex; flex-direction: column-reverse;}
	.faq-box dd .image { margin: 15px 0 0 0; text-align: center;}
	.faq-box dd .desc  { text-align: left;}
	.faq-box dd .memo  { padding-left: 1em; margin-top: 15px; text-indent: -1em; font-size: 14px;}
	
	#go_goods { margin-top: 30px;}
}