@charset "utf-8";

/*--------------------------------------------
	 BASE
--------------------------------------------*/
@media screen and (max-width : 767px ) {
.for_pc {
	display: none;
}
body {
	min-width: 100% !important;
	font-size: 13px;
	overflow-x: hidden;
}
/*--------------------------------------------
	GLOBAL CSS
--------------------------------------------*/
img {
	max-width: 100%;
}
/*--------------------------------------------
	FRAMEWORK
--------------------------------------------*/
    
.under #mainimage {
	display: flex;
	justify-content: center;
	padding: 80px 0 30px;
	background-size: cover;
	background-position: center;
}
.under #mainimage .pageTtl {
	font-size: 19px;
}
.under .secTtl {
	font-size: 18px;
	margin: 0 0 20px;
	padding: 0 40px;
}
.under .secTtl02 {
	margin: 0px 0 15px;
}
.hTitle01 {
	font-size: 22px;
}
.detialBtn a {
	padding: 15px 95px;
}
.detialBtn a:hover {
	background: #e48c7d;
}
.secTtl:before, .secTtl:after {
	width: 30px;
}
#sec_foot {
	padding: 30px 0;
}
#sec_foot .secInner {
	width: 92%;
	margin: auto;
}
#sec_foot .secInner .logoArea {
	width: 100%;
	margin: 0 auto 10px;
	float: none;
}
#sec_foot .secInner .infoArea {
	float: none;
	width: 100%;
	text-align: center;
}
#sec_foot .secInner p {
	text-align: center;
}
/*--------------------------------------------
	TOP PAGE
--------------------------------------------*/
#top .slick-dotted.slick-slider {
	padding: 53px 0 0 0;
	margin: 0 0 20px 0;
}
/*--------------------------------------------
	TOP PAGE SECTION_01
--------------------------------------------*/
#top #sec_01 {
	width: 100%;
	padding: 40px 0;
}
#top #sec_01 .secInner {
	width: 100%;
	margin: auto;
	font-size: 14px;
}
#top #sec_01 .secInner .box01 {
	padding: 0 0 30px;
	width: 91%;
	margin: auto;
}
#top #sec_01 .secInner .box01 p {
	line-height: 1.9;
	padding: 15px 0 0 0;
	text-align: left;
}
#top #sec_01 .secInner .about .txt h3 {
	font-size: 18px;
}
#top #sec_01 .secInner .about .txt {
	top: 30%;
}
#top #sec_01 .secInner .about ul {
	display: block;
}
#top #sec_01 .secInner .about li {
	width: 100%;
	margin: 0 auto 30px;
}
#top #sec_01 .secInner .about li:last-child {
	margin: 0 auto;
}
#top .online_bnr{
    width: 80%;
    margin: 0 auto 3em;
}
#top #sec_02 {
	padding: 40px 0;
	width: 100%;
}
#top #sec_02 .secInner {
	width: 100%;
	margin: auto;
}
#top #sec_02 .secInner .box01 {
	width: 92%;
	margin: auto;
	font-size: 14px;
}
#top #sec_02 .secInner .box01 p {
	line-height: 1.9;
	padding: 10px 0px 25px;
	text-align: left;
}
#top #sec_02 .secInner .product ul {
	display: block;
}
#top #sec_02 .secInner .product li {
	width: 100%;
	margin: 0 auto 30px;
}
#top #sec_02 .secInner .product li:last-child {
	margin-bottom: 0;
}
#top #sec_03 {
	padding: 40px 0;
}
#top #sec_03 .secInner {
	width: 92%;
	margin: auto;
}
#top #sec_03 .secInner .boxWrapp {
	width: 100%;
	margin: auto;
}
#top #sec_03 .secInner .news {
	margin: 25px 0;
}
#top #sec_03 .secInner .date {
	width: 100%;
	box-sizing: border-box;
}
#top #sec_03 .secInner .newsTitle {
	width: 100%;
	box-sizing: border-box;
	padding: 0;
}
#top #sec_03 .secInner .boxWrapp a {
	display: block;
	padding: 15px;
	box-sizing: border-box;
	border-bottom: 1px solid #f4ebdb;
}
#top #sec_03 .secInner .date {
	width: 100%;
	box-sizing: border-box;
	font-size: 16px;
	padding: 0px 0 0 10px;
	margin-bottom: 10px;
}
/*slider*/
#top .slick-dots li button:before {
	font-size: 15px;
}
#top .slick-dots li {
	margin: 0 10px;
}
#top .slick-dots {
	bottom: -25px;
}
/*打ち消し*/
#top #sec_03 .secInner .boxWrapp a:hover {
	background: #fff;
}
#top #sec_03 .secInner .boxWrapp a {
	transition: none;
}
/*-----------------------------------------------------
	ABOUT　菊屋商店とは
------------------------------------------------------*/
    
    
#about.under .secTtl {
	z-index: 1;
}
#about header, #about footer, #about #mainimage {
	position: static;
	z-index: 999;
}
#about #sec_01 {
	padding: 30px 0 30px;
}
#about #sec_01 .secInner {
	width: 92%;
	margin: auto;
}
#about #sec_02 .secInner {
	width: 100%;
}
#about #sec_01 .greeting {
	writing-mode: unset;
	z-index: 1;
	white-space:normal;
}
#about #sec_01 .greeting br {
	line-height: 3;
}
#about #sec_01 .greeting p {
	font-size: 14px;
	line-height: 1.9;
}
#about #sec_02 {
	z-index: 1;
	padding: 30px 0 30px;
}
#about #sec_02 .outline .lBox {
	width: 100%;
	float: none;
}
#about #sec_02 .outline .rBox {
	width: 92%;
	margin: 5px auto 5px;
	float: none;
}
#about #sec_03 .secInner {
	width: 100%;
}
#about #sec_03 .lBox {
	width: 100%;
	float: none;
}
#about #sec_03 .rBox {
	width: 100%;
	float: none;
}
#about #sec_02 table, #about #sec_02 tr, #about #sec_02 th, #about #sec_02 td {
	width: 100%;
	display: block;
}
#about #sec_02 th {
	padding: 10px 0 0 0;
}
#about #sec_02 td {
	padding: 0 0 10px 0;
	font-weight: normal;
}
#about #sec_03 {
	padding: 30px 0 30px;
}
#about #sec_03 .hisWrapp .date {
	font-size: 20px;
}
#about #sec_03 .hisWrapp .cont {
	font-weight: normal;
	font-size: 12px;
}
/*パララックス*/
    
.bg_container {
	position: static;
	opacity: 0.5;
}
#parallax-bg4 img {
	position: absolute;
	left: 0;
	right: 0;
	top: 20%;
}
/*-----------------------------------------------------
	ITEM　商品案内
------------------------------------------------------*/
    
#item #sec_01 {
	padding: 40px 0 40px 0;
}
#item #sec_01 .secInner {
	width: 100%;
	margin: auto;
	padding: 158px 40px 0px;
	background-size: contain;
}
#item #sec_01 .secInner .box, #item #sec_02 .secInner .box {
	width: 100%;
	padding: 20px;
	margin-bottom: 30px;
}
#item #sec_01 .secTtl02 {
	margin: 0 0 10px;
	font-size: 18px;
}
#item #sec_01 .secInner ul, #item #sec_02 .secInner ul {
	margin: 0px 0 20px;
}
#item .secInner ul li {
	width: 100%;
	margin-bottom: 10px;
}
#item .secInner ul li:last-child {
	margin-bottom: 0;
}
#item .secInner ul li .txtArea {
	padding: 20px;
}
#item #sec_01 .secInner ul li p, #item #sec_02 .secInner ul li p {
	font-size: 13px;
}
#item .secInner ul li .txtArea h4 {
	padding: 0px 0 5px;
}
#item .secInner .detialBtn a {
	padding: 15px 60px;
}
#item #sec_02 .secInner {
	width: 92%;
	margin: auto;
	background-size: contain;
	padding: 135px 40px 0px;
}
#item #sec_01 .secInner ul li a:hover {
	background: #fff;
	color: #000;
}
/*-----------------------------------------------------
	BISINESS　業務用商品
------------------------------------------------------*/
#business #sec_01 {
	padding: 30px 0 30px 0;
}
#business #sec_01 .secInner {
	width: 92%;
	margin: auto;
	background-size: contain;
	padding: 147px 0 0 0;
}
#business #sec_01 .secInner .box {
	margin: auto;
	width: 100%;
	padding: 20px;
	margin-bottom: 30px;
}
#business #sec_01 .secInner .product {
	display: block;
	margin-bottom: 20px;
}
#business #sec_01 .secInner .product:last-child {
	margin-bottom: 0;
}
#business #sec_01 .secInner .product .imgArea {
	width: 100%;
}
#business #sec_01 .secInner .product:nth-child(odd) .imgArea {
	order: 1;
}
#business #sec_01 .secInner .product .txtArea {
	padding: 25px;
	width: 100%;
}
#business #sec_01 .secInner .product .txtArea h5 {
	margin-bottom: 10px;
}
#business #sec_02 {
	padding: 30px 0 0;
}
#business #sec_02 .secInner {
	width: 100%;
}
#business #sec_02 .box img {
	width: 100%;
}
#business #sec_02 .box p {
	font-size: 14px;
}
#business #sec_03 {
	padding: 30px 0;
}
#business #sec_03 .secInner {
	width: 100%;
}
#business #sec_03 .secInner ul {
	width: 92%;
	margin: 0 auto 20px;
}
#business #sec_03 .secInner li {
	width: 48%;
	margin-bottom: 20px;
}
#business #sec_03 .secInner li:nth-child(3), #business #sec_03 .secInner li:nth-child(4) {
	margin-bottom: 0;
}
#business #sec_03 .secInner li a:hover h4 {
	background: #fff;
	color: #000;
}
/*-----------------------------------------------------
	STORY　海苔のお話
------------------------------------------------------*/
#story #sec_01 .secInner {
	width: 100%;
	margin: auto;
}
#story #sec_01 .secInner .box {
	width: 92%;
	margin: auto;
}
#story .wrapp {
	background-size: 49%;
}
#story #sec_01 .secInner .box img {
	margin-bottom: 10px;
}
#story #sec_01 .read {
	padding: 20px 25px;
}
#story #sec_01 .secInner .box p {
	width: 100%;
	line-height: 1.9;
	font-size: 13px;
	text-align: left;
}
/*-----------------------------------------------------
	SHOP　店舗案内
------------------------------------------------------*/
#shop #sec_01 {
	padding: 0;
}
#shop #sec_01 .secInner {
	width: 92%;
	margin: auto;
	padding: 30px 0;
}
#shop #sec_01 .access .textBox li {
	font-size: 14px;
	line-height: 1.9;
	padding: 10px 0;
}
#shop #sec_01 .access .textBox li:first-child {
	padding-top: 0;
}
#shop #sec_01 .access .textBox .lBox {
	float: none;
	width: 100%;
}
#shop #sec_01 .access .textBox .rBox {
	float: none;
	width: 100%;
	font-weight: normal;
}
#shop #sec_01 .access .textBox, #shop #sec_01 .access02 .textBox {
	width: 92%;
	margin: auto;
	float: none;
	padding: 0;
}
#shop #sec_01 .access .imgBox {
	width: 100%;
	margin: 0 auto 20px;
	float: none;
	padding: 0;
}
#shop #sec_01 .access02 .imgBox {
	width: 100%;
	margin: 0;
	float: none;
	padding: 0;
}
#shop #sec_01 .access .textBox, #shop #sec_01 .access02 .textBox {
	width: 92%;
	margin: 0 auto 30px;
	float: none;
}
#shop #sec_01 .access .textBox {
	margin: 0 0 30px 0;
}
#shop #sec_01 .access02 .hTtl {
	font-size: 16px;
}
#shop #sec_01 .access02 .textBox li {
	font-size: 14px;
	border-bottom: 1px solid #d7d7d8;
	padding: 10px 0;
}
#shop #sec_01 .access02 .textBox li:first-child {
	border: none;
}
#shop #sec_01 .access02 .textBox li.sample3-1::before {
	border: none;
}
#shop #sec_01 .access02 .textBox li.sample3-1::after {
	border: none;
}
/*-----------------------------------------------------
	NEWS　新着情報
------------------------------------------------------*/
#news #sec_01 {
	padding: 30px 0;
}
#news #sec_01 .secInner {
	width: 92%;
	margin: auto;
}
#news #sec_01 .date {
	float: none;
	width: 100%;
	margin: 0 0 10px 0;
}
#news #sec_01 .ttl {
	width: 100%;
	float: none;
}
#news #sec_01 li {
	padding: 20px 10px;
}
#news .news_single h3 {
	font-size: 20px;
}
#news .news_single .txt_box {
	font-size: 14px;
}
  
#news .news_single .txt_box img{
  height: auto;
}
  
/*打ち消し*/
    
#news #sec_01 li a:hover {
	text-decoration: none;
	color: #000;
}
#news #sec_01 li a:after {
	background: #fff;
}
#news #sec_01 li a {
	transition: none;
}
#news .news_single .link_btn:hover {
	background-position: 0%;
}
#news .news_single .link_btn a {
	transition: none;
}
/*-----------------------------------------------------
	PRIVACY　プライバシーポリシー
------------------------------------------------------*/
#privacy #sec_01 .secInner {
	width: 92%;
}
#privacy #sec_01 .privacypolicy_box {
	width: 100%;
	font-size: 13px;
}
#privacy #sec_01 .privacypolicy_box span {
	font-size: 17px;
}
/*-----------------------------------------------------
	SITEMAP　　サイトマップ
------------------------------------------------------*/

#sitemap #sec_01 {
	padding: 40px 0 80px;
	background: none;
	position: relative;
}
#sitemap #sec_01:before {
	position: absolute;
	z-index: 1;
	content: "";
	width: 80%;
	padding-top: 59.5%;
	right: 4%;
	bottom: 120px;
	opacity: 0.5;
}
#sitemap #sec_01 .secInner {
	width: 92%;
	position: relative;
	z-index: 2;
}
#sitemap #sec_01 ul {
	display: block;
}
#sitemap #sec_01 ul a {
	padding: 0 0 0 15px;
}
#sitemap #sec_01 li {
	width: 100%;
	margin-top: 0;
}
#sitemap #sec_01 li:nth-child(-n+2) {
	margin-right: 0;
}
#sitemap #sec_01 li:nth-child(n+2) {
	margin-top: 20px;
}
/*-----------------------------------------------------
	CONTACT　お問い合わせ
------------------------------------------------------*/
#contact .wrapp {
	padding: 15px;
}
#contact #sec_01 .secInner {
	width: 92%;
	margin: auto;
}
#contact #sec_01 .secInner .txt {
	font-size: 14px;
	text-align: left;
}
#contact #sec_01 table, #contact #sec_01 tr, #contact #sec_01 th, #contact #sec_01 td {
	width: 100%;
	display: block;
	padding: 0;
	border: none;
}
#contact #sec_01 tr {
	padding: 10px 0 10px 0;
	border: none;
}
#contact #sec_01 th {
	padding: 6px 9px 2px;
	background: #fbd2cb;
	box-sizing: border-box;
	margin: 0 0 8px 0;
}
#contact #sec_01 .radioWrapp {
	padding: 0;
}
#contact #sec_01 .sheet_01 td input.middle {
	box-sizing: border-box;
	width: 100%;
}
#contact #sec_01 .sheet_01 td input.short {
	width: 100%;
	box-sizing: border-box;
}
#contact #sec_01 .sheet_01 td input.long {
	width: 100%;
	box-sizing: border-box;
	display: block;
}
#contact #sec_01 .sheet_01 td li input, #contact #sec_01 .sheet_01 td li select {
	margin: 0;
}
#contact #sec_01 .sheet_01 td li {
	margin: 0;
}
form#mailformpro {
	padding: 0;
}
.mfp_element_text, .mfp_element_number, .mfp_element_select-one, .mfp_element_email, .mfp_element_tel, .mfp_element_textarea {
	margin: 0;
}
.must-fill {
	margin: 2px 0 0 0;
}
.not_must-fill {
	background: #585858;
	margin: 2px 0 0 0;
}
/*確認画面*/
    
div#mfp_phase_confirm h4 {
	font-size: 18px;
	margin: 0px 0 6px;
}
/*サンクスページ*/
    
#thanks #sec_01 {
	padding: 30px 0;
}
#thanks #sec_01 .secInner {
	width: 92%;
	margin: auto;
}
#thanks h3 {
	margin: 0 0 20px;
}
#thanks .txt {
	margin: 0 0 30px;
}
/*-----------------------------------------------------
	PAGER
------------------------------------------------------*/
.wp-pagenavi {
	font-size: 14px;
}
.wp-pagenavi *:nth-child(n+2) {
	margin-left:5px;
}
/* ボタン<a>タグのデザイン */
.wp-pagenavi a, .wp-pagenavi .current, .wp-pagenavi .extend {
	line-height: 25px;
	width:25px;
}

/* 矢印（ < とか > ）のデザイン */
.wp-pagenavi .extend {
	display:none;
}
/*--------------------------------------------
  404
--------------------------------------------*/
#not-found .errMsg {
    padding:50px 0;
}

#not-found .errMsg .title {
    font-size:20px;
    margin-bottom:25px;
}
#not-found .errMsg .text {
    font-size:14px;
    margin-bottom:40px;
    line-height:2.5;
    text-align:left;
    width:92%;
    margin:0 auto 25px;
}
}
