@charset "utf-8";

/* -----------------------------------------------------------
　共通要素・可変画像（親要素幅まで）
----------------------------------------------------------- */

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

  body {
    -webkit-text-size-adjust: 100%;
    font-size:14px;
  }
   
  .pc_cont {
    display:none;
  } 
   
  figure {
    margin:0 auto 1em;
    text-align:center;
  } 
  
  figcaption {
    font-size:1em;
    margin:0.5em 0 0;
  }
	
  #telfaxflow,
  #returned,	
  #mscard {padding-top:50px;margin-top:-50px;}
}

/* -----------------------------------------------------------
  テンプレート
----------------------------------------------------------- */

@media screen and (max-width: 768px){
#wpadminbar {position:fixed!important;}	
.customize-support header {top:46px;}
.customize-support nav {top:46px;}
.customize-support nav p {top:46px;}
  /* :::::::::: header :::::::::: */
	
  header {
    position:fixed;
    width:100%;
    height:60px; 
    background:#FFF;
    border-bottom:solid 1px #eae4ed;
    z-index:99;
    top:0;
  }
  
  header .header_box {
    width:98%;
    height:auto;
    overflow:hidden;
    margin:0 0 0 2%;
  }

  header .header_box .logo {
    position:relative;
    width:calc(100% - 125px);
    height:50px;
    margin:5px 0;
    float:left;
  }
  
  header .header_box .logo img {
    width:100%;
    max-width:278px;
    max-height:50px;
    position:absolute;
    margin:auto;
    top:0;
    bottom:0;
    left:0;
  }
  
  header .header_box .cart {
    text-indent:-9999px;
    width:60px;
    height:60px;
    float:right;
    margin:0 60px 0 0;
    border-left:solid 1px #eae4ed;
    border-right:solid 1px #eae4ed;
    background:url(./img/common/header_cart_sp.png) center center /cover;
  }
  
  header .header_box .cart a {
    display:block;
    width:100%;
    height:100%;
  }
  
  header + .sp_cont {padding:60px 0 0;}
  header + .sp_cont p img {display:block;}
  header + .sp_cont p.tel {
    box-sizing:border-box;
    padding:10px 2%;
    width:100%;
    height:auto;
    background:#9477a7;
  }
  
  header + .sp_cont .sub_title {
    display:none;
    padding:0.5em 2%;
    font-size:2.4vw;
    line-height:1.5;
    text-align:center;
  }
  header + .sp_cont ul {
    width:96%;
    margin:0 auto;
    overflow:hidden;
  }
  
  header + .sp_cont ul li {
    box-sizing:border-box;
    position:relative;
    font-size:1.2em;
    text-align:center;
    width:25%;
    padding:0 1%;
    float:left;
    z-index:0;
  }
  
  header + .sp_cont ul li::after {
    position:absolute;
    display:block;
    content:"";
    width:1px;
    height:2.4em;
    margin:auto;
    top:0;
    bottom:0;
    right:0;
    background:#9477a5;
  }
  
  header + .sp_cont ul li:last-child::after {content:none;}
  
  header + .sp_cont ul li a {
    box-sizing:border-box;
    display:block;
    width:100%;
    height:100%;
    padding:0.9em 0;
  }

  /* :::::::::: nav :::::::::: */

  nav {
    position:fixed;
    width:100%; 
    height:auto;
    z-index:99;
    top:60px;
  }
  
  nav.open {height:100%;}

  nav .menu {
    position:fixed;
    width:60px;
    height:60px;
    top:0;
    right:0;
    z-index:99;
  }
  
  nav div.menu_box {
    position:fixed;
    display:none;
    width:100%;
    height: calc(100% - 60px);
    overflow-y: auto;
    background:#FFF;
    z-index:0;
    top:61px;
  }
	
  .customize-support div.menu_box {top:105px;}
  
  nav .top_nav_sp {
    width:96%;
    height:auto;
    overflow:hidden;
    margin:3% auto;
  }
  nav .top_nav_sp li {
    height:40px;
    float:left;
    text-align:center;
    line-height:40px;
    font-size:3vw;
  }
  nav .top_nav_sp li.tn_houjin {display:none;}
  nav .top_nav_sp li.tn_home {width:32%;margin:0 2% 2% 0;}
  nav .top_nav_sp li.tn_brand {width:60%;margin:0 2% 2% 0;}
  nav .top_nav_sp li.tn_contact {width:38%;margin:0 0 2% 0;}
  nav .top_nav_sp li.tn_fb {width:10%;margin:0 1% 2% 0;}
  nav .top_nav_sp li.mypage {width:32%;margin:0 2% 2% 0;}
  nav .top_nav_sp li.login {width:32%;margin:0 0 2% 0;}
  nav .top_nav_sp li.login { border-radius:20px;background:#9578a4;}
  nav .top_nav_sp li a {
    display:block;
    width:100%;
    height:100%;
    border-radius:20px;
  }
  
  nav .top_nav_sp li.tn_home a ,
  nav .top_nav_sp li.login a {  
    color:#FFF;
    background:#9578a4;
  }
  
  nav .top_nav_sp li.mypage a {
    color:#000;
    background:#c7c7c7;
  }
  
  nav .top_nav_sp li.tn_brand a ,
  nav .top_nav_sp li.tn_contact a {
    color:#000;
    background:#EAE4ED;
  }
  
  nav .top_nav_sp li.tn_fb img {
    width:auto;
    max-width:none;
    max-height:30px;
    vertical-align:middle;
  }
  
  nav div.tel_nav {display:none;}
  nav ul.bottom_nav {display:none;}
  
  nav ul.bottom_nav_sp {
    width:96%;
    margin:0 auto;
    overflow:hidden;
  }

  nav ul.bottom_nav_sp > li.nav_gr {
    width:49%;
    height:auto;
    overflow:hidden;
    float:left;
  }
  
  nav ul.bottom_nav_sp > li.nav_gr:nth-child(2) {margin:0 0 0 2%;float:left;}
  
  nav ul.bottom_nav_sp > li.nav_gr > ul > li {
    box-sizing:border-box;
    width:100%;
    height:auto;
    overflow:hidden;
    margin:0 0 2.5%;
    padding:2.5%;
    background:#eae4ed;
  }
  
  nav ul.bottom_nav_sp > li.nav_gr > ul > li:last-child {background:#9477A5;}
  
  nav ul.bottom_nav_sp > li.nav_gr ul > li > span {
    box-sizing:border-box;
    position:relative;
    display:block;
    width:100%;
    height:auto;
    padding:33% 0 0;
  }
  nav ul.bottom_nav_sp > li.nav_gr ul li > span img {position:absolute;top:0;bottom:0;margin:auto;left:37%;
  right:0;}
  
  nav ul.bottom_nav_sp > li.nav_gr:nth-of-type(1) ul li:nth-of-type(1) > span {background:url(./img/common/mn_sp01.png) no-repeat top left /auto 100%;}
  nav ul.bottom_nav_sp > li.nav_gr:nth-of-type(1) ul li:nth-of-type(2) > span {background:url(./img/common/mn_sp02.png) no-repeat top left /auto 100%;}
  nav ul.bottom_nav_sp > li.nav_gr:nth-of-type(1) ul li:nth-of-type(3) > span {background:url(./img/common/mn_sp03.png) no-repeat top left /auto 100%;}
  nav ul.bottom_nav_sp > li.nav_gr:nth-of-type(2) ul li:nth-of-type(1) > span {background:url(./img/common/mn_sp04.png) no-repeat top left /auto 100%;}
  nav ul.bottom_nav_sp > li.nav_gr:nth-of-type(2) ul li:nth-of-type(2) > span {background:url(./img/common/mn_sp05.png) no-repeat top left /auto 100%;}
  nav ul.bottom_nav_sp > li.nav_gr:nth-of-type(2) ul li:nth-of-type(3) > span {background:url(./img/common/mn_sp06.png) no-repeat top left /auto 100%;}
  
  nav ul.bottom_nav_sp > li.nav_gr:nth-of-type(1) ul li:nth-of-type(1) > span img {width:12vmin;}
  nav ul.bottom_nav_sp > li.nav_gr:nth-of-type(1) ul li:nth-of-type(2) > span img {width:15vmin;}
  nav ul.bottom_nav_sp > li.nav_gr:nth-of-type(1) ul li:nth-of-type(3) > span img {width:24vmin;}
  nav ul.bottom_nav_sp > li.nav_gr:nth-of-type(2) ul li:nth-of-type(1) > span img {width:12vmin;}
  nav ul.bottom_nav_sp > li.nav_gr:nth-of-type(2) ul li:nth-of-type(2) > span img {width:15vmin;}
  nav ul.bottom_nav_sp > li.nav_gr:nth-of-type(2) ul li:nth-of-type(3) > span img {width:18vmin;}
  
  nav ul.bottom_nav_sp > li.nav_gr ul > li > span::after {
    position:absolute;
    display:block;
    content:"";
    width:1.4em;
    height:0.65em;
    background:url(./img/common/sp_mn_after.png) no-repeat bottom center /cover;
    bottom:10%;
    right:27%;
    transition:0.5s;
  }
  
  nav ul.bottom_nav_sp > li.nav_gr ul > li:last-child > span::after {background:url(./img/common/sp_mn_afterw.png) no-repeat bottom center /cover;}
    
  nav ul.bottom_nav_sp > li.nav_gr ul li > span.open::after {
    transition:0.5s;
    transform:rotateX(180deg);
  }  
  
  nav ul.bottom_nav_sp > li.nav_gr ul li > ul {
    display:none;
    width:96%;
    height:auto;
    margin:10px auto;
  }
  
  nav ul.bottom_nav_sp > li.nav_gr ul li > ul li {
    font-size:3.2vmin;
    line-height:1.8em;
    margin:0 0 0.5em;
  }
  
  nav ul.bottom_nav_sp > li.nav_gr ul li > ul li span {
    position:relative;
    display:block;
    padding:0 0 0 1em;
  }  
  
  nav ul.bottom_nav_sp > li.nav_gr ul > li:last-child > ul > li span {
    color:#FFFFFF;
  }  
  
  nav ul.bottom_nav_sp > li.nav_gr ul li > ul span::before {
    position:absolute;
    display:block;
    content:">";
    top:0;
    left:0;
  }
  
  nav ul.bottom_nav_sp > li.header_gift_sp {width: 100%;}
  nav ul.bottom_nav_sp > li.header_gift_sp img {width: 100%;}
  
  nav ul.bottom_nav_sp + .sp_cont {
    width:100%;
    margin:4% 0 0;
    clear:both;
  }
  
  nav ul.bottom_nav_sp + .sp_cont p:nth-of-type(1) {
    width:75%;
    margin:0 auto 3%;
  }
  
  nav ul.bottom_nav_sp + .sp_cont p:nth-of-type(2) {
    width:100%;
    margin:0 auto 3%;
    background:#9477a5;
    color:#FFF;
    text-align:center;
    padding:0.5em 0;
    font-family: "ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
    font-size:3vmin;
  }
  
  nav ul.bottom_nav_sp + .sp_cont p:nth-of-type(3) {width:90%;margin:0 auto 5%;text-align:center;}
  nav ul.bottom_nav_sp + .sp_cont p:nth-of-type(3) img {display:block;margin:0 auto 2%;}
  nav ul.bottom_nav_sp + .sp_cont p.close {
    width:100%;
    height:auto;
    text-align:center;
    background:#eae4ed;
    font-size:3vmin;
    padding:2.2em 0;
    color:#714988;
  }
  
  nav ul.bottom_nav_sp + .sp_cont p.close span {
    position:relative;
    padding:0 0 0 3em;
  }
  
  nav ul.bottom_nav_sp + .sp_cont p.close span::before {
    position:absolute;
    display:block;
    content:"×"; 
    font-size:2em;
    height:1em;
    margin:auto;
    left:0;
    top:-100%;
    bottom:-100%;
  }
  
  .ico_menu {
    position: fixed;
    z-index: 99;
    width: 100%;
    height: 65px;
    inset: auto 0 0;
  }
  .ico_menu ul {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 100%;
    background: #FFFFFF;
    border-top: solid 1px #9477A5;
  }
  .ico_menu ul li {
    position: relative;
    z-index: 0;
    width: 20%;
  }
  .ico_menu ul li::after {
    position: absolute;
    z-index: 0;
    display: block;
    content: "";
    width: 1px;
    height: 66%;
    background: #9477A5;
    inset: 0 0 0 auto;
    margin: auto;
  }
  .ico_menu ul li:nth-last-child(1)::after {display: none;}
  .ico_menu ul li a {
    display: block;
    width: 100%;
    height: 100%;
    padding: 10px 0;
    text-decoration: none;
    text-align: center;
    line-height: 1.2;
  }
  .ico_menu ul li a span {
    display: block;
    font-family: "ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
    font-size: 11px;
    color: #000000;
  }
  .ico_menu ul li a span::before {
    display: block;
    content: "";
    width: 100%;
    height: 30px;
    margin: 0 auto 7px;
  }
  .ico_menu ul li.ico_tel a span::before {background: url("./img/common/ico_tel.svg") no-repeat top center / auto 100%;}
  .ico_menu ul li.ico_recipe a span::before {background: url("./img/common/ico_recipe.svg") no-repeat top center / auto 100%;}
  .ico_menu ul li.ico_cart a span::before {background: url("./img/common/ico_cart.svg") no-repeat top center / auto 100%;}
  .ico_menu ul li.ico_katei a span::before {background: url("./img/common/ico_katei.svg") no-repeat top center / auto 100%;}
  .ico_menu ul li.ico_zoutou a span::before {background: url("./img/common/ico_zoutou.svg") no-repeat top center / auto 100%;}
}
  
@media screen and (max-width: 768px){  
  /* :::::::::: breadcrumbs :::::::::: */
  
  .breadcrumbs {
    width:92%;
    height:auto;
    font-size:13px;
	  line-height:1.5em;
    color:#000;
    padding:0;
    margin:0 auto 3%;
    overflow:hidden;
    font-family: "ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  }
  
  .breadcrumbs span {
    display:inline-block;
    margin:0;
  }
  
  .breadcrumbs span a {
    color:#000;
  }  
	
  .breadcrumbs span:first-child {margin-left:0;}

  /* :::::::::: main :::::::::: */

  main {
    display:block;
    width:100%;
    height:auto;
    padding:30px 0 0;
  }
  
  .home main {padding:0;}
  
  main article {
    width:100%;
    height:auto;
    overflow:hidden;
    margin:0 auto 50px;
  }
  
  main article p {
    margin:0 0 1em;
    line-height:1.7em;
  }
  
  main article .box {
    width:92%;
    height:auto;
    margin:0 auto;
    overflow:hidden;
  }
  
  main article .t_box {
    width:92%;
    height:auto;
    margin:0 auto;
    overflow:hidden;
  }
  
  main article .m_box {
    width:92%;
    height:auto;
    margin:0 auto;
    overflow:hidden;
  }
  
  main article .i_box {
    width:92%;
    height:auto;
    margin:0 auto;
    overflow:hidden;
  }	
  
  main article .c_box {
    box-sizing:border-box;
    width:100%;
    height:auto;
    overflow:hidden;
    margin:0 auto 10%;
    padding:5%;
    clear:both;
    background:#ebe5ef;
    font-family: "ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  }	
  
  main article .c_box h5 {
    font-weight:bold;
    color:#714988;
    font-size:21px;
    margin:10% 0 3%;
    clear:both;
  }
  
  main article .c_box h5:nth-of-type(1) {
    margin:0 0 3%;
  }
  
  main article p.lead {
    width:92%;
    height:auto;
    overflow:hidden;
    margin:0 auto 1em;
    padding:2em 0;
    clear:both;
    line-height:1.9em;
  }	
  
  main article p.sub_lead {
    margin:0 auto 2em;
    line-height:1.9em;
  }	
  
  main article p.bg_mark {background:url(./img/common/bg_mark.png) no-repeat center center / auto 90%;}
  main article p.bg_text {background:url(./img/common/bg_text.png) no-repeat center center / 80%;}
  main article p.bg_logo {background:url(./img/common/bg_logo.png) no-repeat center center / auto 90%;}
  
  main article ul.about_banner {
    box-sizing:border-box;
    width:92%;
    height:auto;
    overflow:hidden;
    margin:8% auto;
  }
  
  main article ul.about_banner li {
    width:49%;
    height:auto;
    float:left;
    margin:0 2% 2% 0;
  }
  
  main article ul.about_banner li img {display:block;}
  
  main article ul.about_banner li:nth-child(even) {margin:0 0 2%;}
  
  main article ul.product_banner {
    box-sizing:border-box;
    width:92%;
    height:auto;
    overflow:hidden;
    margin:0 auto 8%;
  }
  
  main article ul.product_banner li {
    width:50%;
    height:auto;
    float:left;
    margin:0;
    padding:0;
  }
  
  main article ul.product_banner li img {display:block;}
  
  
  
  
  main article section {
    width:100%;
    height:auto;
    overflow:hidden;
    text-align:left;
    word-wrap: break-word;
    margin:0;
    padding:0;
  }
  
  main article section.h3_box {
    margin:0 auto 8%;
  }

  section p:last-child,
  section figure:last-child,
  section table:last-child,  
  section ul:last-child,  
  section ol:last-child,  
  section dl:last-child{ 
    margin-bottom:0;
  }

  div.wide_area {
    box-sizing:border-box;
    position:relative;
    width:100%;
    height:auto;
    padding:30% 0 0;
  }
     
  div.wide_area .box {
    position:absolute;
    margin:auto;
    top:0;
    bottom:0;
    right:0;
    left:0;
  }
  
  .h3_box div.wide_area {
    padding:28% 0 0;
    margin:0 auto 5%;
  }
  
  div.title_area {
    box-sizing:border-box;
    position:relative;
    width:100%;
    margin:0 0 6%;
    padding:28% 0 0;
    background:#ccc;
  }
  
  main article p.common_link {
    width:100%;
    max-width:180px;
    height:50px;
    margin:5% auto 0;
    text-align:center;
    line-height:50px;
  }
  
  main article p.common_link a {
    box-sizing:border-box;
    display:block;
    width:100%;
    height:100%;
    background:#eae4ee;
  }
  
  main article p.common_link_t a {
    background:none;
    border:solid 1px #000;
  }
  
  main article p.store_link {
    width:92%;
    box-sizing:border-box;
    padding:0;
    height:50px;
    margin:0 auto 12%;
  }
  
  main article p.store_link a {
    display:block;
    width:100%;
    height:100%;
    text-align:center;
    color:#FFF;
    background:#714988;
    line-height:50px;
  }
  
  main article p.store_link a span {
    position:relative;
    padding:0 0 0 50px;
  }
  
  main article p.store_link a span::before {
    position:absolute;
    display:block;
    content:"";
    width:40px;
    height:41px;
    margin:auto;
    background:url(./img/common/bg_store.png) no-repeat;
    top:0;
    bottom:0;
    left:0;
  }
  
  main article p.store_link a span::after {
    display:inkline;
    content:">";
    margin:0 0 0 0.5em;
  }
  
  main article p span.caution {
    position:relative;
    padding:0 0 0 1.2em;
    display:block;
  }
  
  main article p span.caution:before {
    position:absolute;
    content:"※";
    top:0;
    left:0;
  }
  
  section.common_contact {
    position:relative;
    box-sizing:border-box;
    width:92%;
    margin:0 auto 10%;
    height:auto;
    padding:1em 0 0;
  }
  
  section.common_contact > div {
    width:100%;
    height:auto;
    margin:0;
    box-sizing:border-box;
    border:solid 1px #000;
    z-index:0;
    padding:8% 5%5%;
    overflow:hidden;
  }
    
  section.common_contact div h3 {
    position:absolute;
    display:block;
    width:80%;
    height:auto;
    background:#FFF;
    text-align:center;
    padding:0.3em 0.5em;
    margin:auto;
    top:0;
    left:0;
    right:0;
    z-index:1;
  }
  
  section.common_contact div figure {display:none;}
  section.common_contact div div p.common_link {margin:0 auto 5%;}
  section.common_contact div div p.mail_contact {width:60%;height:auto;margin:0 auto 5%;}
  
  .common_catalog {
    width:92%;
    margin:0 auto 10%;
  }
  
  a.mailto {color:#714988;}
  
  
  
  
  /* :::::::::: 下部共通コンテンツ :::::::::: */
  
  main article .bottom_content {
    margin:5% auto 5%;
    font-family: "ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  }
  
  main article .bottom_content div {
    position:relative;
    box-sizing:border-box;
    padding:3%;
    border:solid 1px #714987;
    overflow:hidden;
    width:100%;
    margin:0 auto 2%;
  }　
  
  main article .bottom_content div:nth-of-type(3) {text-align:center;}
  
  /*main article .bottom_content div:nth-of-type(4),
  main article .bottom_content div:nth-of-type(6) {
    width:49%;
    margin:0 2% 2% 0;
    float:left;
  }
  
  main article .bottom_content div:nth-of-type(7),
  main article .bottom_content div:nth-of-type(5) {
    width:49%;
    margin:0 0 2%;
    float:left;
  }*/
  
  main article .bottom_content div h3 {
    width:100%;
    text-align:center;
    font-size:20px;
    color:#714987;
    margin:0 0 0.5em;
  }
  
  main article  div p.detail_link {
    width:150px;
    height:35px;
    text-align:center;
    line-height:35px;
    background:#eae4ed;
    margin:0 auto;

  }
  
  main article .bottom_content div p.detail_link {
    /*position:absolute;*/
    width:120px;
    /*margin:auto;
    bottom:3%;
    left:0;
    right:0;*/
  }
  
  main article  div p.detail_link a {
    display:block;
    width:100%;
    height:100%;
  }
  
  main article  div p.detail_link a::after {
    content:">"; 
    margin:0 0 0 0.5em;
  }
  
  .bottom_content p.next_month {
    float:right;
    margin:0 0 0.5em;
  }
  
  div#biz_calendar {
    width:100%!important;
	  height:auto!important;
	  max-width:540px!important;
	  border:none;
	  padding:0;
  }
  
  table.bizcal {
    width:100%;
    margin:0 auto 0.5em;
    border:none!important;  
  }
  
  table.bizcal th {
    box-sizing:border-box!important;
    width: 14.2%!important;
    border:solid 2px #FFF!important;
    font-weight:normal!important;
    background:#714987!important;
    color:#FFF!important;
    text-align:center!important;
    padding:0.5em 0!important;
  }
  
  table.bizcal td {
    box-sizing:border-box!important;
    border:solid 2px #FFF!important;
    font-weight:normal!important;
    vertical-align:top!important;
    height:3em!important;
    padding:0 0.5em!important;
    background:#efefef!important;
    font-size:14px!important;
    text-align:left!important;
  } 
  table.bizcal tr:nth-of-type(1) td {height:0.5em!important;background:none!important;}
  table.bizcal td img {width:auto;max-width:none;}
  
  table.bizcal td.holiday {
    background:#9477a5!important;
    color:#FFF!important;
  }
  
  table.bizcal td.down-img {text-align:right!important;padding:0 1em!important;}
  table.bizcal td.today-img {text-align:right!important;padding:0!important;}
  table.bizcal td.up-img {text-align:right!important;padding:0!important;}
  
  table.bizcal + p {
    position:relative;
    float:right;
    padding:0 0 0 1.5em;
  }
  
  table.bizcal + p::before {
    position:absolute;
    display:block;
    content:"";
    width:1.2em;
    height:1.2em;
    background:#9477a5;
    left:0;
    top:0;
    bottom:0;
    margin:auto;
  }
	table.bizcal + p span {display:none!important;}
  table.bizcal + p span.boxholiday::before {content:none!important;}
  
  ul.guide {margin:0 auto 20px;}
  ul.guide li {
    position:relative;
    line-height:1.7em;
    padding:0 0 0 1.5em;
    font-size:0.9em;
  }
  
  ul.guide li::before {
    position:absolute;
    display:block;
    content:"";
    width:1em;
    height:1em;
    border-radius:50%;
    background:#000;
    top:0.2em;
    left:0;
  }
  
  ul.cr_card {margin:0 auto 20px;}
  ul.cr_card li {display:inline;margin:0;}
  ul.cr_card li img {width:auto;max-width:none;}
  
  main article .bottom_content div p span {
    position:relative;
    display:block;
    line-height:1.5em;
    padding:0 0 0 1.2em;
    font-size:0.9em;
  }
  
  main article .bottom_content div:nth-of-type(4) p:nth-of-type(1) img {display:block;width:30%;margin:0 auto 0.5em;}
  main article .bottom_content div:nth-of-type(4) p:nth-of-type(2) img {display:block;width:90%;margin:0 auto 2em;}
  main article .bottom_content div:nth-of-type(4) p:nth-of-type(3) img {display:block;width:30%;margin:0 auto 0.5em;}
  main article .bottom_content div:nth-of-type(4) p:nth-of-type(4) img {display:block;width:90%;margin:0 auto 0.5em;}
  main article .bottom_content div:nth-of-type(5) p:nth-of-type(2) img {display:block;width:40%;margin:0 auto 0.5em;}
  main article .bottom_content div:nth-of-type(6) p:nth-of-type(3) img {display:block;width:60%;margin:0 auto 0.5em;}
  main article .bottom_content div:nth-of-type(7) p:nth-of-type(2) img {display:block;width:60%;margin:0 auto 0.5em;} 
  /*main article .bottom_content div:nth-of-type(4) p:nth-of-type(4) {margin:0 auto 80px;}
  main article .bottom_content div:nth-of-type(5) p:nth-of-type(3) {margin:0 auto 80px;}
  main article .bottom_content div:nth-of-type(6) p:nth-of-type(3) {margin:0 auto 70px;}
  main article .bottom_content div:nth-of-type(7) p:nth-of-type(2) {margin:0 auto 70px;}*/
  main article .bottom_content div p span:before {
    position:absolute;
    display:block;
    content:"※";
    width:1em;
    height:1em;
    top:0;
    left:0;
  } 
  /* :::::::::: aside :::::::::: */

  aside {display:none;}
  
  ul.aside_sns {
    text-align:center;
    overflow:hidden;
    margin:0 auto 50px;
  }
  
  ul.aside_sns li {
    display:inline-block;
    margin:0 5px;
  }

  /* :::::::::: footer :::::::::: */
  
  footer {
    width:100%;
    height:auto;
    background:url(./img/common/bg_footer.png) no-repeat center center,#9477a7;
    background-size:auto 80%;
    color:#FFF;
    text-align:center;
    padding:50px 0;
  }
  
  footer p.pagetop {
    box-sizing:border-box;
    position:fixed;
    z-index:100;
    bottom:130px;
    right:0;
    width:3em;
    height:10em;
  }
  
  footer .f_logo {
    width:90%;
    margin:3% auto;
  }
  
  footer .address {font-size:2.4vmin;}
  footer .copyright {font-size:2vmin;}
  
}

/* -----------------------------------------------------------
 hx
----------------------------------------------------------- */

@media screen and (max-width: 768px){
  main article > div.company {background:url(./img/h1/bg_company.png) center center / cover;}
  main article > div.guide {background:url(./img/h1/bg_guide.png) center center / cover;}
  main article > div.quality {background:url(./img/h1/bg_quality.png) center center / cover;}
  main article > div.about {background:url(./img/h1/bg_about.png) center center / cover;}
  main article > div.boil {background:url(./img/h1/bg_boil.png) center center / cover;}
  main article > div.condiment {background:url(./img/h1/bg_condiment.png) center center / cover;}
  main article > div.production_process {background:url(./img/h1/bg_production_process.png) center center / cover;}
  main article > div.recipe {background:url(./img/h1/bg_recipe.png) center center / cover;}
  main article > div.trivia {background:url(./img/h1/bg_trivia.png) center center / cover;}
  main article > div.qa {background:url(./img/h1/bg_qa.png) center center / cover;}
  main article > div.delivery {background:url(./img/h1/bg_delivery.png) center center / cover;}
  main article > div.product {background:url(./img/h1/bg_product.png) center center / cover;}
  main article > div.voice {background:url(./img/h1/bg_voice.png) center center / cover;}
  main article > div.payment {background:url(./img/h1/bg_payment.png) center center / cover;}
  main article > div.flow {background:url(./img/h1/bg_flow.png) center center / cover;}
  main article > div.contact {background:url(./img/h1/bg_contact.png) center center / cover;}
  main article > div.catalogue {background:url(./img/h1/bg_catalogue.png) center center / cover;}
  main article > div.service {background:url(./img/h1/bg_service.png) center center / cover;}
  main article > div.register {background:url(./img/h1/bg_register.png) center center / cover;}
  main article > div.firsttime {background:url(./img/h1/bg_firsttime.png) center center / cover;}
  main article > div.spring_campaign {background:url(./img/h1/bg_spring_campaign.png) center center / cover;}
  main article > div.autumn_campaign {background:url(./img/h1/bg_autumn_campaign.png) center center / cover;}
  main article > div.category_baby {background:url(./img/h1/bg_category_baby.png) center center / cover;}
  main article > div.survey {background:url(./img/h1/bg_survey_sp.png) center center / cover;padding: 35% 0 0;}
  div.title_area.survey h1 {height: 50%;}

  div.title_area h1 {  
    box-sizing:border-box;
    position:absolute;
    width:100%;
    padding:0 4%;
    height:36%;
    margin:auto;
    top:0;
    bottom:0;
    right:0;
    left:0;
  }
  
  div.title_area h1 img {
    width:auto;
    height:100%;
    max-width:none;
    max-height:none;
  }
	
  main article h1.h1_border {
    font-size:24px;
    color:#714987;
    text-align:left;
    margin:0 0 20px;
    padding:0 0 5px;
    line-height:1.2em;
    border-bottom:solid 1px #714988;
  }  
	
  main article .single_box {
    height:auto;
	min-height:200px;
	margin:0 auto 5%;
  } 

  main article h2.h2_common {
    font-size:24px;
    color:#714987;
    text-align:center;
    margin:0 0 20px;
  }  
  
  main article h2.h2_border {
    font-size:24px;
    color:#714987;
    text-align:left;
    margin:0 0 20px;
    padding:0 0 5px;
    line-height:1.2em;
    border-bottom:solid 1px #714988;
  }  
  
  main article h2.h2_mark {
    box-sizing:border-box;
    width:100%;
    height:auto;
    font-size:24px;
    background:url(./img/h2/h2_mark.png) no-repeat top left/ auto 1.5em;
    margin:0 0 20px;
    padding:0.3em 0 0.3em 0.75em;
    line-height: 1;
  }
  
  main article h2.h2_side {
    width:100%;
    height:auto;
    text-align:center;
    margin:0 auto 20px;
    font-size:24px;
    color:#714987;
    line-height:1.2em;
  }
  
   main article h2.h2_side span {
     box-sizing:border-box;
     max-width:100%;
     width:auto;
     display:inline-block;
     position:relative;
     padding:0 20%;
     background:url(./img/h2/h2_side_l.png) no-repeat left center,url(./img/h2/h2_side_r.png) no-repeat right center;
     background-size:18%;
  }

  main article h2.h2_img {
    box-sizing:border-box;
    width:50%;
    height:auto;
    padding:0;
    text-align:center;
    margin:0 auto;
  }
  
  main article h2.h2_img img {
    width:auto;
    max-width:100%;
  }
  
  main article section.point h2 {
    position:relative;
    box-sizing:border-box;
    width:100%;
    height:auto;
    font-size:1.4em;
    padding:1.8em 0 0%;
    margin:0 auto 5%;
    background:url(./img/h2/bg_point.png) no-repeat top left / auto 1.4em;
  }
  
  main article section.point h2 span {
   display:inline-block;
    float:right;
    width:21%;
  }
  
  main article section.check h2 {
    position:relative;
    box-sizing:border-box;
    width:100%;
    height:auto;
    font-size:1.2em;
    padding:1.8em 0 0;
    margin:0 auto 3%;
    background:url(./img/h2/bg_check.png) no-repeat top left / auto 1.4em;
  }
  
  .h3_box .company01 {background:url(./img/h3/bg_company01.png) center center / cover;}
  .h3_box .company02 {background:url(./img/h3/bg_company02.png) center center / cover;}
  .h3_box .company03 {background:url(./img/h3/bg_company03.png) center center / cover;}
  .h3_box .company04 {background:url(./img/h3/bg_company04.png) center center / cover;}
  .h3_box .guide01 {background:url(./img/h3/bg_guide01.png) center center / cover;}
  .h3_box .quality01 {background:url(./img/h3/bg_quality01.png) center center / cover;}
  .h3_box .quality02 {background:url(./img/h3/bg_quality02.png) center center / cover;}
  .h3_box .quality03 {background:url(./img/h3/bg_quality03.png) center center / cover;}
  /*.h3_box .about01 {background:url(./img/h3/bg_about01.png) center center / cover;}
  .h3_box .about02 {background:url(./img/h3/bg_about02.png) center center / cover;}
  .h3_box .about03 {background:url(./img/h3/bg_about03.png) center center / cover;}
  .h3_box .about04 {background:url(./img/h3/bg_about04.png) center center / cover;}*/
  
  div.wide_area h3.h3_img {  
    box-sizing:border-box;
    position:absolute;
    width:92%;
    padding:0 4px;
    height:20%;
    margin:auto;
    top:0;
    bottom:0;
    right:0;
    left:0;
    text-align:center;
  }
  
  div.wide_area h3.h3_img img {
    width:auto;
    height:100%;
    max-width:none;
    max-height:none;
  }
  
  section.about div.wide_area h3.h3_img {
    width:100%;
    height:auto;
  }
  
  h3.h3_center {
    font-size: 20px;
    color: #714988;
    text-align: center;
    line-height: 1.7;
    margin: 0 auto 10px;
  }
  
  .h4_box h4.h4_img {max-width:100%;margin:5% auto;text-align:center;}
}



/* -----------------------------------------------------------
 home
----------------------------------------------------------- */

@media screen and (max-width: 768px){
  
  /** 商品価格改定のお知らせ **/
  
  .price_caution {
    box-sizing:border-box;
    width:100%;
    /*max-width:90%;*/
    margin:0 auto 20px;
    border:solid 3px #9477a7;
    padding:20px 10px;
    background: url(./img/index/bg_about.png) no-repeat center / auto 80%, #eae4ee;
  }
  .price_caution h2{ 
    font-size:20px;
    margin:0 0 1em;
    text-align: center;
    color: #9477a7;
  }
  .price_caution p { 
    font-size:13px;
    margin:0 0 0.5em;
  }
  .price_caution p span {font-size: 1.2em;font-weight: bold;} 
  main article .price_caution .common_link {
    max-width:240px;
    margin:20px auto;
  } 
  
  main article .price_caution .common_link a {
    font-family: "ヒラギノ明朝 ProN W6", "HiraMinProN-W6","游明朝",YuMincho,"Yu Mincho","HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
    background:#714985;
    color:#FFFFFF;
  }
  main article .price_caution .fcRed {text-decoration:underline;}
  .table_outer {width:100%;overflow-x:scroll;margin:0 auto 30px;}
  .table_outer::before {
    content:"※左右にスクロールしてご覧いただけます。";
    font-size:1.15em;font-weight:bold;
    color:#FF0000;
  }
  .price_table {width:200%;border-collapse: collapse;margin:0 auto 30px;font-size:12px;}
  .price_table th,.price_table td {border:solid 1px #000;text-align:center;line-height:1.3;padding:0.5em 0.5em;font-weight:normal;}
  .price_table th {background:#dbdfbe;color:#934734;}
  .price_table th span,.price_table td span {font-size:0.8em;}
  .price_table .fs120 {font-size:120%;}
  .price_table .row {width:1.5em;line-height:1.1;}
  .price_table .bg_tr {background:#faf9eb;}
  .price_table .nowprice {background:#cddae6;color:#005482;}
  .price_table tr td:nth-last-of-type(1) {color:#9f4d39;}
  .price_table tr td img {width:70px;}
  .price_table02 {width:100%;}
  
  
  
  .keyv {
    width:100%;
    height:auto;
    margin:0 auto 3%;
  }
  .keyv p.first_visit {
    border-top:solid 1px #999;
    border-bottom:solid 1px #999;  
  }
  .keyv p.first_visit img {display:block;}
  .keyv p.first_visit + p img {display:block;}
  .keyv ul.slider {margin:0 0 30px;}
  
  .keyv ul.slider li {
    height:auto;
  }
  
  .keyv ul.slick-dots {bottom:-20px!important;marign:0!important;}
  .keyv ul.slick-dots li {margin:0!important;}
  .slick-dots li.slick-active button {padding:0!important;}
  .slick-dots li.slick-active button:before {color:#9477a5!important;opacity:1!important;}
  .slick-dots li button:before{color:#c7c7c7!important;opacity:1!important;}

  /* TOPページ上部バナー */
  
  p.contest img {width:100%;}
  
  .index_banner {
    /*width:94%;*/
    height:auto;
    /*overflow:hidden;*/
    margin:0 auto 10%;
  }
  
  .index_banner li {
    width:100%;
    height:auto;
    margin:0 auto 5%;
    font-size:1.3em;
  }
  
  .index_banner li img {width:100%;}
  
  .index_banner li.camp_banner img {
    transform: scale(1.04);
    transform-origin: left;
    padding-top: 7px;
  }
  
  .index_banner.index_banner_bottom {
    width:92%;
    margin:5% auto 0;
  } 
  .index_banner.index_banner_bottom li {width:100%;} 
  
  
  .box_visible {overflow:visible!important;}
  main article p#top_banner img {width:100%;}
  main article p#autumn_banner {
    position:relative;
    width:100%;
    height:auto;
    margin:0 auto 4%;
  }
  
  main article p#autumn_banner a {
    position:relative;
    box-sizing:border-box;
    display:block;
    width:100%;
    height:100%;
    padding:52% 0 0;
  }
  
  main article p#autumn_banner img {
    position:absolute;
    top:0;
    width:105.5%;
    max-width:none;
  }
  
  
  /* 家庭用商品 */  
  
  section.for_family {margin:0 auto 10%}
  section.for_family h2 span {
    display:block;
    font-size:14px;
    margin:1em 0 0;
  }
  
  ul.for_family {
    width:100%;
    height:auto;
    overflow:hidden;
    margin:0 auto 5%;
  }
  
  ul.for_family li {
    position:relative;
    box-sizing:border-box;
    width:48.5%;
    height:auto;
    float:left;
    margin:0 3% 3% 0;
    z-index:0;
  }
  
  ul.for_family li a {
    box-sizing:border-box;
    display:block;
    width:100%;
    padding:20% 0 0;
    height:auto;
    font-size:3.6vmin;
  }
  
  ul.for_family li:nth-child(1) a,
  ul.for_family li:nth-child(2) a,
  ul.for_family li:nth-child(3) a,
  ul.for_family li:nth-child(4) a,
  ul.for_family li:nth-child(5) a,
  ul.for_family li:nth-child(6) a,
  ul.for_family li:nth-child(7) a,
  ul.for_family li:nth-child(8) a {
    padding:100% 0 0;
  }
  
  ul.for_family li a > span {
    position:absolute;
    box-sizing:border-box;
    display:block;
    width:100%;
    height:auto;
    bottom:0;
    padding:0.7em 0.5em 0.7em;
    background:rgba(148,119,165,1);
    color:#FFF;
  }
  
  /*ul.for_family li:nth-child(5) a > span,
  ul.for_family li:nth-child(6) a > span,
  ul.for_family li:nth-child(7) a > span,
  ul.for_family li:nth-child(8) a > span,*/
  ul.for_family li:nth-child(9) a > span,
  ul.for_family li:nth-child(10) a > span,
  ul.for_family li:nth-child(11) a > span,
  ul.for_family li:nth-child(12) a > span {
    box-sizing:border-box;
    margin:auto;
    top:0;
    left:100%;
    width:142%;
    padding:2em 0.5em;
    font-size:2.7vmin;  
    height:100%;
    vertical-align: middle;
  }
  
  ul.for_family li a > span > span {font-size:60%;display:inline;}
  
  ul.for_family li.family01 {background:url(./img/index/family01.png) center center / cover;}
  ul.for_family li.family02 {background:url(./img/index/family02.png) center center / cover;}
  ul.for_family li.family03 {background:url(./img/index/family03.png) center center / cover;}
  ul.for_family li.family04 {background:url(./img/index/family04.png) center center / cover;}
  ul.for_family li.family05 {background:url(./img/index/family05.png) center center / cover;}
  ul.for_family li.family06 {background:url(./img/index/family06.png) center center / cover;}
  ul.for_family li.family07 {background:url(./img/index/family07.png) center center / cover;}
  ul.for_family li.family08 {background:url(./img/index/family08.png) center center / cover;}
  ul.for_family li.family09 {background:url(./img/index/family09.png) center center / cover;}
  ul.for_family li.family10 {background:url(./img/index/family10.png) center center / cover;}
  ul.for_family li.family11 {background:url(./img/index/family11.png) center center / cover;}
  ul.for_family li.family12 {background:url(./img/index/family12.png) center center / cover;}
  
  /**冬用スタイル**/
  /*ul.for_family.winter li.family01 {background:url(./img/index/family01_w_sp.png) top center / 100%;}*/
  ul.for_family.winter li.family01 {background:url(./img/index/family01_w.png) top center / 165%;}
  ul.for_family.winter li.family02 {background:url(./img/index/family02_w.png) top center / 110%;}
  ul.for_family.winter li.family03 {background:url(./img/index/family03_w.png) top center / 110%;}
  ul.for_family.winter li.family04 {background:url(./img/index/family04_w.png) top center / 110%;}
  ul.for_family.winter li.family05 {background:url(./img/index/family05_w.png) center center / cover;}
  ul.for_family.winter li.family06 {background:url(./img/index/family06_w.png) top center / 110%;}
  ul.for_family.winter li.family07 {background:url(./img/index/family07_w_sp.png) top center / 100%;}
  ul.for_family.winter li.family08 {background:url(./img/index/family08_w.png) top center / 110%;}
  ul.for_family.winter li.family09 {background:url(./img/index/family09_w.png) center center / cover;}
  ul.for_family.winter li.family10 {background:url(./img/index/family10_w.png) center center / cover;}
  ul.for_family.winter li.family11 {background:url(./img/index/family11_w.png) center center / cover;}
  ul.for_family.winter li.family12 {background:url(./img/index/family12_w.png) center center / cover;}
  
  /*ul.for_family li:nth-child(5) ,
  ul.for_family li:nth-child(6) ,
  ul.for_family li:nth-child(7) ,
  ul.for_family li:nth-child(8) ,*/
  ul.for_family li:nth-child(9) ,
  ul.for_family li:nth-child(10) ,
  ul.for_family li:nth-child(11) ,
  ul.for_family li:nth-child(12) {
    background:#eae4ed;
    width:20%;
    height:auto;
    margin:0 31.5% 3% 0;
    padding:15% 0 0;
  }
  ul.for_family.winter li:nth-child(9) ,
  ul.for_family.winter li:nth-child(10) ,
  ul.for_family.winter li:nth-child(11) ,
  ul.for_family.winter li:nth-child(12) {background:#eae4ed;  }
  
  
  
  
  ul.for_family li:nth-child(even) {
    margin:0 0 3%;
  }
  
  ul.for_family li::after {
    position:absolute;
    display:block;
    content:"";
    bottom:15%;
    left:-2%;
    z-index:1;
    width:35%;
    height:35%;
  }
  
  ul.for_family li.family01::after {background:url(./img/index/fm01.png) no-repeat bottom left / 90%;bottom:18%;left:0;}
  ul.for_family li.family02::after {background:url(./img/index/fm02.png) no-repeat bottom left / 100%;bottom:18%;left:0;}
  ul.for_family li.family03::after {background:url(./img/index/fm03.png) no-repeat bottom left / 100%;bottom:15%;left:0;}
  ul.for_family li.family04::after {background:url(./img/index/fm04.png) no-repeat bottom left / 100%;bottom:15%;left:0;}
  ul.for_family li.family05::after {background:url(./img/index/fm05.png) no-repeat bottom left / 100%;bottom:16%;left:0;}
  ul.for_family li.family06::after {background:url(./img/index/fm06.png) no-repeat bottom left / 100%;bottom:16%;left:0;}
  ul.for_family li.family07::after {background:url(./img/index/fm07.png) no-repeat bottom left / 100%;bottom:18%;left:0;}
  ul.for_family li.family08::after {background:url(./img/index/fm08.png) no-repeat bottom left / 100%;bottom:16%;left:0;}
  ul.for_family li.family09::after {background:url(./img/index/fm09.png) no-repeat bottom left / 100%;}
  ul.for_family li.family10::after {background:url(./img/index/fm10.png) no-repeat bottom left / 100%;}
  ul.for_family li.family11::after {background:url(./img/index/fm11.png) no-repeat bottom left / 100%;}
  ul.for_family li.family12::after {background:url(./img/index/fm12.png) no-repeat bottom left / 100%;}
  
  /*ul.for_family li:nth-child(5)::after ,
  ul.for_family li:nth-child(6)::after ,
  ul.for_family li:nth-child(7)::after ,
  ul.for_family li:nth-child(8)::after,*/
  ul.for_family li:nth-child(9)::after,
  ul.for_family li:nth-child(10)::after ,
  ul.for_family li:nth-child(11)::after ,
  ul.for_family li:nth-child(12)::after {
    margin:auto;
    top:0;
    bottom:0;
    left:0;
    right:0;
    width:90%;
    height:90%;
  }
  /*
  ul.for_family li:nth-child(9)::after ,
  ul.for_family li:nth-child(10)::after ,
  ul.for_family li:nth-child(11)::after ,
  ul.for_family li:nth-child(12)::after {
    width:40%;
    height:70%;
  } 
  */
  
  section p.bottom_p {
    width:92%;
    font-size:14px;
    line-height:1.8;
    margin:0 auto 1em;
  }
  
  /* 横並びメニュ */ 
  
  ul.index_menu {
    width:auto;
    height:auto;
    text-align:center;
    margin:0 auto;
  }
  
  ul.index_menu li {
    display:inline-block;
    text-align:center;
  }
  
  ul.index_menu li p.detail {
    position:relative;
    z-index:0;
    padding:30px 0;
  }
  
  ul.index_menu li p.detail::after {
    position:absolute;
    z-index:0;
    display:block;
    content:"";
    width:2em;
    height:1em;
    margin:auto;
    bottom:5px;
    left:0;
    right:0;
    background:url(./img/index/index_menu_after.png) no-repeat bottom center / cover;
  }
  
  section.for_family ul.index_menu {width:60%;}
  section.for_family ul.index_menu li {width:100%;}
  
  /* 小野製麺のこだわり */
  
  section.kodawari {
    width:100%;
    margin:0 auto 12%;
  } 
  section.kodawari h2 {
    position:relative;
    width:100%;
    height:0;
    padding:33.3% 0 0;
    margin:0 auto 5%;
    background:url(img/index/bg_kodawari.jpg) no-repeat left / auto 100%;
  }
  section.kodawari h2 span {
    position:absolute;
    display:block;
    width:70%;
    height:2em;
    margin:auto;
    text-align:center;
    top:0;
    bottom:0;
    left:0;
    right:0;
  }
  section.kodawari section {
    width:90%;
    margin:0 auto 5%;
    padding:30px 0 0;
    background:url(img/index/bg_notice.png) no-repeat top center / 58%;
  }
  section.kodawari section h3 {
    font-size:24px;
    text-align:center;
    margin:0 auto 5%;
  }
  section.kodawari section + p {clear:both;}
  section.kodawari .index_menu li p.detail {width:70%;margin:0 auto 1em;}
  
  section.kodawari .common_link {
    display:inline-block;
    width:10em;
    margin:5% 2% 0;
  }
  
  
  /* 人気ランキング */
  
  section.ranking {
    width:100%;
    margin:0 0 10%;
    padding:0 0 5%;
    overflow:visible;
  }
  
  section.ranking ul {
    width:90%;
    margin:0 auto 5%;
  }
  
  section.ranking ul li {
    position:relative;
    width:100%;
    height:auto;
    margin:0;
    float:left;
    z-index:0;
  }
  section.ranking ul li > div {
    position:relative;
    width:48%;
    margin:0 4% 0 0;
    float:left;
    padding:0;
  }
  section.ranking ul li > div.ranking01 {width:100%;margin:0;padding:2em 0;}
  section.ranking ul li > div.ranking03 {margin:0;}
  section.ranking ul li > div.ranking05 {margin:0;}
  section.ranking ul li > div > a {position:relative;}
  section.ranking ul li > div > a img {
    width:60%;
    margin:0 auto;
  }
  section.ranking ul li > div.ranking01 > a img {width:100%;}
  section.ranking ul li > div::before {
    position:absolute;
    display:block;
    content:"";
    width:16%;
    height:20%;
    right:0;
    top:0;
    z-index:10;
  }
  section.ranking ul li > div.ranking01::before {background:url(./img/index/rank01_before.png) no-repeat top right /auto 100%;right:50%;}
  section.ranking ul li > div.ranking02::before {background:url(./img/index/rank02_before.png) no-repeat top center /100% auto;}  
  section.ranking ul li > div.ranking03::before {background:url(./img/index/rank03_before.png) no-repeat top center /100% auto;}  
  section.ranking ul li > div.ranking04::before {background:url(./img/index/rank04_before.png) no-repeat top 15px center /80% auto;}
  section.ranking ul li > div.ranking05::before {background:url(./img/index/rank05_before.png) no-repeat top 15px center /80% auto;}
  
  section.ranking ul li p.rank_name {
    font-family: "ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
    font-size:3vmin;
    color:#714987;
    font-weight:bold;
    height:3em;
    line-height:1.3em;
    display:table-cell;
    vertical-align:middle;
    padding:0;
    margin:0;
  }

  section.ranking ul li p.rank_detail {
    position:relative;
    font-family: "ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
    margin:0 0 1em;
    font-size:1.8vmin;
    height:5em;
    overflow:hidden;
  }
  section.ranking ul li p.rank_detail + p {
    font-size:2.2vmin;
    font-family: "ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
    line-height:1.2;
  }
  
  section.ranking ul li p.rank_price {
    font-family: "ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
    font-size:2.5vmin;
    margin:0 0 1em;
    line-height:1.2;
  }
  
  section.ranking ul li p.common_link {
    max-width:8em;
    height:30px;
    line-height:30px;
    margin:0 auto;
  }
  
  section.ranking ul li > div.ranking01 > a {width:48%;float:left;margin:0 4% 0 0;}
  section.ranking ul li > div.ranking01 > a + div {width:48%;float:left;margin:0;}
  section.ranking ul li > div.ranking01 p.rank_detail {height:auto;font-size:2.4vmin;}
  section.ranking ul li > div.ranking01 p.common_link {margin:0;float:left;}
  
  section.ranking ul .slick-arrow {
    position:absolute;
    display:block;
    width:6vw;
    height:18vw;
    background:#eae4ed;
    margin:auto;
    top:0;
    bottom:0;
  }
  section.ranking ul .slick-prev {left:-8vw;}
  section.ranking ul .slick-next {right:-8vw;}
  section.ranking ul .slick-arrow::before {content:none;}
  section.ranking ul .slick-arrow::after {
    position:absolute;
    display:block;
    content:"";
    width:0;
    height:0;
    margin:auto;
    top:0;
    bottom:0;
    left:0;
    right:0;
    border-top:solid 2vw transparent;
    border-bottom:solid 2vw transparent;
  }
  section.ranking ul .slick-prev::after {border-right:solid 2vw #FFFFFF;right:10%;}
  section.ranking ul .slick-next::after {border-left:solid 2vw #FFFFFF;left:10%;}
  
  
  
  /* 贈答用商品 */
  
  section.for_gift {margin:0 auto 10%;}
  section.for_gift h2 span {
    display:block;
    font-size:14px;
    margin:1em 0 0;
  }
  section.for_gift ul {
    width:92%;
    height:auto;
    overflow:hidden;
    margin:0 auto 5%;
  }
  
  section.for_gift ul li {
    width:100%;
    height:auto;
    float:left;
    margin:0 auto 2%;
  }
  section.for_gift ul li img {width:100%;display:block;}
  /*section.for_gift ul li:nth-child(even) {margin:0 0 2%;}*/
  /*section.for_gift ul li:nth-child(1) {width:100%;margin:0 0 2%;}*/
  
  section.for_gift p.bottom_p {width:92%;margin:0 auto 5%;}
  
  section.for_gift ul.index_menu {width:92%;margin:0 auto;}
  section.for_gift ul.index_menu li {width:48%;margin:0 auto;float:none;}  
  section.for_gift ul.index_menu li:nth-child(2) {margin:0 0 4%;}  
  section.for_gift ul.index_menu li:nth-child(1) img {max-width:100%;}
  section.for_gift ul.index_menu li:nth-child(2) img {max-width:90%;}
  
  /* 中段バナー */
  
  ul.index_middle_banner {
    box-sizing:border-box;
    width:92%;
    overflow:hidden;
    margin:0 auto;
  }
  ul.index_middle_banner:nth-of-type(2) {margin:0 auto 10%;}
  ul.index_middle_banner li img {width:100%;display:block;}
  ul.index_middle_banner li {
    width:100%;
    margin:0 0 4%;
  }
  ul.index_middle_banner:nth-of-type(2) li {
    width:48%;
    margin:0 4% 4% 0;
    float:left;
  }
  ul.index_middle_banner:nth-of-type(2) li:nth-child(even) {margin:0 0 4%;}

  
  /* 半田めんのおいしいレシピ */
  
  section.recipe {margin:0 0 10%;} 
  section.recipe .wide_area {
    position:relative;
    background:url(./img/index/bg_recipe_sp.jpg) no-repeat center center / cover;
    padding:33.3% 0 0; 
    margin:0 0 5%;
  }
  
  section.recipe .wide_area .box {display:none;}
  
  section.recipe .wide_area + p {
    width:81%;
    height:auto;
    margin:0 auto 1.5em;
  }
  section.recipe p.link_recipe {
    width:90%;
    margin:0 auto 4em;
  }
  section.recipe p.link_recipe a {
    box-sizing:border-box;
    display:block;
    width:100%;
    height:100%;
    text-align:center;
    padding:0.5em 1em;
    background:#eae4ed;
  }
  section.recipe ul.index_menu {
    width:100%;
    overflow:hidden;
  }
  
  section.recipe ul.index_menu > li {
    width:48%;
    margin:0 4% 4% 0;
    overflow:hidden;
    float:left;
  }
  
  section.recipe ul.index_menu > li:nth-child(even) {margin:0 0 4%;}

  /*section.recipe ul.index_menu > li div p {display:none;}*/
  
  /*section.recipe ul.index_menu > li p.common_link::before {
    position:absolute;
    z-index:0;
    display:block;
    content:"";
    width:2em;
    height:1em;
    margin:auto;
    top:1em;
    left:0;
    right:0;
    background:url(./img/index/index_menu_after.png) no-repeat bottom center / cover;
  }*/
  
  section.recipe ul.index_menu > li div figure {
   /* position:relative;*/
    width:100%;
    height:auto;
    margin:0;
    /*padding:67.5% 0 0;*/
    overflow:hidden;
    z-index:0;  
  } 
  section.recipe ul.index_menu > li div figure + p {margin:0 0 1em;}
  section.recipe ul.index_menu > li div figure img {
    /*position:absolute;*/
    width:100%;
    /*margin:auto;
    top:-100%;
    bottom:-100%;
    left:0;
    right:0;*/
    display:block;
  }
  
  section.recipe ul.index_menu > li p.common_link {
    margin: 0 auto 2em;
    max-width:100%;
    position:relative;
    padding:0;
    font-size:12px;
    height:auto;
    line-height:1.5em;
  }
  section.recipe ul.index_menu > li p.common_link a {padding:1.1em 0 1em;}
  section.recipe ul.index_menu > li:nth-child(1) p.common_link a {background:#eaf5e1;}
  section.recipe ul.index_menu > li:nth-child(2) p.common_link a {background:#ffefea;}
  section.recipe ul.index_menu > li:nth-child(3) p.common_link a {background:#f9efd6;letter-spacing:-0.1em;}
  section.recipe ul.index_menu > li:nth-child(4) p.common_link a {background:#eee6da;}
  
  /* お知らせ */
  
  section.recipe + .box > .news_cont {
    display:flex;
    flex-direction:column;
  }
  section.notice {order:1;}
  section.monthly {order:0;}
  section.recipe + .box > .instagram_cont {
    margin: 0 auto 10%;
  }
  
  section.fb_box p {font-family: "ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;}
  
  .fb_plugin {margin:0 auto 10%;text-align:center;}
  
  section.notice {
    width:100%;
    height:auto;
    margin:0 auto 10%;
  }
  
  section.notice dl::-webkit-scrollbar {
    width: 12px;
  }
  
  section.notice dl::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
    box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
    border-radius: 10px;
  }
  
  section.notice dl::-webkit-scrollbar-thumb {
    border-radius: 10px;
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.5);
    box-shadow: inset 0 0 6px rgba(0,0,0,0.5);
  }
  
  section.notice dl {
    width:100%;
    height:24em;
    overflow-y:scroll;
    background:url(./img/index/bg_notice.png) no-repeat center center /auto 70%;
    font-family: "ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
    border:solid 1px #969696;
  }
  
  section.notice dl dt {
    box-sizing:border-box;
    width:100%;
    font-size:15px;
    line-height:1.3em;
    padding:1em 0 0.5em 3%;
  }
  
  section.notice dl dd {
    box-sizing:border-box;
    width:100%;
    padding:0 3% 1em 3%;
    border-bottom:solid 1px #c7c7c7;
    font-size:15px;
    line-height:1.3em;
  }
  
  section.notice dl dd a {text-decoration:underline;}
  
  /* 今月のレシピ */
  
  section.monthly {
    width:100%;
    height:auto;
    margin:0 0 10%;
  }
  
  section.monthly figure {
    width:48%;
    height:48%;
    float:left;
    margin:0;
  }
  
  section.monthly div {
    width:48%;
    float:right;
  }
  
  section.monthly div dl {
    font-family: "ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  }
  
  section.monthly div dl dt {
    font-size:20px;
    margin:0 0 0.5em;
    font-weight:bold;
    line-height:1.5em;
  }
  
  section.monthly div dl dd {line-height:1.7em;}

  section.monthly div p.common_link {
    float:right;
    max-width:100%;
    margin:1.5em 0 0;
  }
  
  /* 迷った時は */  
  /*section.select {margin:0;}
  section.select .index_menu {width:92%;margin:0 auto;}
  section.select .index_menu li {width:80%;margin:0 auto 10%;}
  section.select .index_menu li p.detail {padding:10px 0% 30px;margin:0 auto;}
  section.select .index_menu li p.detail span {display:block;margin:0 0 10px;font-size:1em;}
  section.select .index_menu li p.detail img {display:block;width:70%;margin:0 auto;}*/
  
  /* お役立ち情報 */  
  section.select_info {margin:0 auto 10%;;}
  section.select_info .index_menu {width:100%;margin:0 auto;}
  section.select_info .index_menu li {width:100%;margin:0 auto 5%;}
  
  /* お客様の声 */
  
  section.index_voice {margin:0 auto 15%;}
  section.index_voice .box dl {
    position:relative;
    width:86%;
    margin:0 auto 3%;
    padding:65px 7% 60px;
    background:url(img/index/bg_index_voice_sp.png) no-repeat top left /100% 100%;
  }
  section.index_voice .box dl:nth-of-type(3) ,
  section.index_voice .box dl:nth-of-type(4) {display:none;}

  section.index_voice .box dl dt {
    font-size:16px;
    line-height:1.5em;
    font-weight:bold;
    color:#714987;
    margin:0 0 1em;
  }
  section.index_voice .box dl dd p {
    font-family: "ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
    font-size:12px;
    line-height:1.8em;
  }
  section.index_voice .box dl dd p.customer {
    font-family: "ヒラギノ明朝 ProN W6", "HiraMinProN-W6","游明朝",YuMincho,"Yu Mincho","HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
    clear:both;
    font-size:14px;
    font-widht:bold;
    color:#714987;
    text-align:right;
    margin:0.5em 0 0;
  }
  
  /* 薬味 */ 
  section.index_wide {
    width:100%;
    height:auto;
    margin:0 0 5%;
  }
  
  section.index_wide .box {
    width:100%;
    height:auto;
    padding:0 0 33.3%;
    margin:0 0 3%;
  }
    
  section.yakumi .box {background:url(./img/index/bg_yakumi_sp.png) no-repeat center center / cover;}
  section.yudekata .box {background:url(./img/index/bg_yudekata_sp.png) no-repeat center center / cover;}  
  section.seizou .box {background:url(./img/index/bg_seizou_sp.png) no-repeat center center / cover;}
  
  section.index_wide .box h2 ,
  section.index_wide .box p {display:none;}
  section.index_wide p {width:85%;margin:0 auto 1em;}
  
  
  /* 小野製麺について */ 
  section.index_about {
    margin:0;
  }
  
  section.index_about .area_g {
    width:100%;
    height:auto;
    overflow:hidden;
    padding:10% 0;
    background:#eae4ed;
  }
  
  section.index_about .area_g section {
    width:100%;
    margin:0 0 10%;
  }
  
  section.index_about .area_g section:nth-of-type(2) {margin:0;}
  
  section.index_about .area_g section h3 {
    font-size:20px;
    margin:0 0 0.5em;
    text-align:center;
  }
  
  section.index_about .area_g section p.common_link {max-width:240px;} 
  
  section.index_about section figure {overflow:hidden;}
  section.index_about section figure img {display:block;float:left;margin:0;}
  section.index_about section:nth-of-type(1) figure img:nth-of-type(1) {width:32.1%;}
  section.index_about section:nth-of-type(1) figure img:nth-of-type(2) {width:67.9%;} 
  section.index_about section:nth-of-type(2) figure img {width:calc(100% / 3);}
  
}

/* -----------------------------------------------------------
 固定ページ
----------------------------------------------------------- */

@media screen and (max-width: 768px){
  
  /**** 会社概要 ****/
  p.master_name {width:92%;margin:0 auto 10%;text-align:center;}
  p.master_name img {width:50%;max-width:none;}  
  .h4_box h4.h4_company01 img {width:calc(1.8 * 28.6%);}
  .h4_box h4.h4_company02 img {width:calc(1.8 * 28.6%);}
  .h4_box h4.h4_company03 img {width:calc(1.8 * 36.4%);}
  .h4_box h4.h4_company04 img {width:calc(1.8 * 32.2%);}
  
  table.table_company {width:100%;margin:0 auto 5%;}
  table.table_company tr {border-top:solid 1px #969696;}
  table.table_company tr:nth-last-of-type(1) {border-bottom:solid 1px #969696;}
  table.table_company tr th {
    box-sizing:border-box;
    width:30%;
    padding:1em;
    font-weight:normal;
  }
  table.table_company tr td {
    box-sizing:border-box;
    width:70%;
    padding:1em;
  }
  
  dl.history {
    width:100%;
    margin:0 auto;
  }
  
  dl.history dt {
    position:relative;
    box-sizing:border-box;
    width:20%;
    height:70px;
    padding:30px 4% 20px 0;
    float:left;
    clear:both;
    border-right:solid 1px #9577a6;
  }
  
  dl.history dt:nth-of-type(1) {height:90px;padding-top:40px;}
  dl.history dt:nth-of-type(2) {height:95px;padding-bottom:20px;}
  dl.history dt:nth-of-type(3) {padding-top:0;}
  dl.history dt:nth-of-type(4) {height:150px;padding-top:10px;}
  dl.history dt:nth-of-type(5) {height:100px;}
  dl.history dt:nth-of-type(8) {height:100px;}
  
  dl.history dt img {
  }
  
  dl.history dd {
    position:relative;
    box-sizing:border-box;
    width:80%;
    height:auto;
    padding:30px 3% 10px 10%;
    float:left;
  }
  
  dl.history dd::after {
    position:absolute;
    display:block;
    content:"";
    width:10px;
    height:10px;
    border-radius:50%;
    background:#9577a6;
    top:38px;
    left:-5px;
  }
    
  dl.history dd::before {
    position:absolute;
    display:block;
    content:"";
    width:10%;
    height:1px;
    background:#9577a6;
    top:43px;
    left:0;
  }
  
  dl.history dd:nth-of-type(1) {padding-top:40px;}
  dl.history dd:nth-of-type(1)::after {top:48px;}
  dl.history dd:nth-of-type(1)::before {top:53px;}
  dl.history dd:nth-of-type(3) {padding-top:10px;}
  dl.history dd:nth-of-type(3)::after {top:18px;}
  dl.history dd:nth-of-type(3)::before {top:23px;}
  dl.history dd:nth-of-type(4) {padding-top:10px;}
  dl.history dd:nth-of-type(4)::after {top:18px;}
  dl.history dd:nth-of-type(4)::before {top:23px;} 
  
  
  dl.history dd span {
    position:absolute;
    display:block;
    right:0;
    top:35px;
	max-width:115px;
  }
  dl.history dd:nth-of-type(2) span {top:50px;}
  dl.history dd:nth-of-type(6) span {top:-35px;}
  
  section.award figure {width:80%;}
  section.award figure:nth-of-type(1) {width:50%;} 
  section.access div.map_box {
    width:100%;
    height:24em;
    margin:2em auto 1em;
  }
  
  section.access div.map_box iframe {
    width:100%;
    height:100%;
  }
  
  p.detail_link {
    font-family: "ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  }
  
  
  /**** お買い物ガイド ****/ 
  .h4_box h4.h4_guide01 img {width:calc(1.8 * 46.8%);}
  .h4_box h4.h4_guide02 img {width:calc(1.8 * 40.8%);}
  .h4_box h4.h4_guide03 img {width:calc(1.8 * 53.1%);}
  .h4_box h4.h4_guide04 img {width:calc(1.8 * 47.1%);}
  .h4_box h4.h4_guide05 img {width:calc(1.8 * 61.1%);}
  .h4_box h4.h4_guide06 img {width:calc(1.8 * 37.8%);}
  
  section.guide .h4_box {margin-bottom:8%;}
  
  dl.service {
    width:100%;
    height:auto;
  }
  
  dl.service dt {
    width:100%;
    margin:0 auto 1em;
  }
  
  dl.service dt span {
    display:block;
    width:25%;
    position:relative;
  }
  
  dl.service dt span::after {
    width:550px;
    height:1px;
    content:"";
    display:block;
    position:absolute;
    background:#714988;
    left:110%;
    bottom:40%;
  }
  
  dl.service dd {
    box-sizing:border-box;
    width:100%;
    padding:0 1em 1em;
    margin:0 0 5%;
    border-bottom:solid 1px #714988;
    line-height:1.7em;
  } 
  
  section.merit {width:100%;margin:0 auto 130px;}
  
  dl.merit dt {
    width:100%;
    margin:0 auto 1em;
    font-size:1.2em;
    font-weight:bold;
    color:#714988;
    text-align:center;
    font-family: "ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  }
  
  dl.merit dd {
    margin:0 auto 2em;
  }
  section.guide .c_box {position:relative;}
  section.guide .c_box dl {
    overflow:hidden;
    margin:0 0 5%;
  }
  
  section.guide .c_box p {font-size:0.9em;}
  
  section dl.hososhi {
    /*width:48%;*/
    margin:0 0 6% 0;
    /*float:left;*/
    text-align:left;
  }
  
  /*section dl.hososhi:nth-of-type(2) {width:50%;margin:0 0 5% 2%;}*/
  
  section dl.hososhi dt {margin:0;font-weight:bold;}
  section dl.hososhi dd {margin:0;}
  section dl.hososhi dd span {display:block;}
  section dl.noshi {
    width:100%;
    margin:0 0 8% 0;
  }
  section dl.noshi dd img {display:block;width:48%;float:left;margin:0 1% 3%}
  
  section dl.noshi dt {text-align:center;margin:0.5em 0;}
  .kakegami {
    margin:0 auto;
    text-align:center;
    overflow:hidden;
  }
  .kakegami figure {
    width:auto!important;
    height:auto!important;
    display:inline-block;
    margin:0 3% 3%!important;
  }
  .kakegami figure img {width:100%;}
  .kakegami figure.kakegami04 {
    width:auto!important;
    height:auto!important;
    display:inline-block;
    margin:0 3% 3%!important;
  }
  .kakegami + p {color:#F00;}
  section dl.fukuro {
    width:40%;
    float:left;
    margin:0 5% 5%;
  }
	
  section.guide dl.fukuro {
    width:40%;
    float:left;
    margin:0 5% 5%;
  }
  
  section dl.fukuro dt {text-align:center;}
  section dl.fukuro dd {text-align:center;}
  section dl.fukuro dd img {width:auto;text-align:center;}
  
  section.guide .c_box figure {
    width:64%;
    margin:0 auto;
  }
	
  section.guide ul.cr_card {text-align:center;}
  
  /**** 品質保証について ****/   
  
  section.quality figure {margin:0 auto 8%;}
  section.quality figure figcaption {font-size:0.9em;text-align:left;}
  section.quality .c_box h5 {font-size:1.2em;}
  ul.fact {margin:8% auto 0;overflow:hidden;}
  ul.fact li {
    width:48%;
    margin:0 4% 4% 0;
    float:left;
  }
  
  ul.fact li:nth-of-type(even) {margin:0 0 4%;}
  ul.fact li p {font-size:0.9em;}
  section.quality p.store_link {margin-top:10%;}
  
  /**** 半田めんについて ****/  
  
  section.about figure figcaption {font-size:0.9em;text-align:right;}
  section dl.about {overflow:hidden;margin:8% 0 0;}
  section dl.about dt {
    width:30%;
    margin:0 5% 8% 0;
    float:left;
    clear:both;
  }
  section dl.about dd {
    width:65%;
    margin:0 0 8%;
    float:left;
    font-size:0.9em;
  }
  
  section dl.about dt:nth-of-type(2) {
    margin:0 0 8% 5%;
    float:right;
  }
  
  section dl.about dd:nth-of-type(2) {float:right;}
  
  section dl.compair {overflow:hidden;margin:8% 0;}
  section dl.compair dt {
    width:48%;
    margin:0 4% 3% 0;
    float:left;
    clear:both;
  }
  section dl.compair dd {
    width:48%;
    margin:0 0 3% 0;
    float:left;
  }
  section dl.compair dd.compair_text {
    width:100%;
    margin:0 0 12%;
    font-size:0.9em;
    clear:both;
  }
  
  section dl.compair dd.compair_text p {margin:1em auto 0;}
  
  section dl.compair dd.compair_text p.detail_link {
    font-family: "ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  }
  
  /**** ゆで方について ****/  
  
  main article p.point_lead {margin:0 auto 7%;}
  
  section.point {
    box-sizing:border-box;
    width:100%;
    margin:0 auto 5%;
  }
  section.point ul {overflow:hidden;}
  section.point ul li {
    overflow:hidden;
    margin:0 auto 5%;
  }
  
  section.point ul li figure {
    width:30%;
    float:left;
    margin:1.5em 0 0;
  }
  
  section.point ul li figure img {display:block;}
  
  section.point ul li dl {
    width:65%;
    float:left;
    margin:0 0 0 5%;
  }
  /*
  section.point ul li dl dt {
    float:left;
    text-align:center;
    width:25%;
    padding:1.5em 0 0;
  }
  
  section.point ul li dl dt img {width:75%;}
  
  section.point ul li dl dd {
    float:left;
    width:70%;
    box-sizing:border-box;
    padding:0 0.5em;
    line-height:1.5em;
  }
  */
  
  section.point ul li dl dt {
    width:100%;
    height:2.5em;
    margin:0 0 0.5em;
  }
  
  section.point:nth-of-type(1) ul li:nth-child(1) dl dt {background:url(./img/sub/process01_sp.jpg) no-repeat top left / auto 100%;}
  section.point:nth-of-type(1) ul li:nth-child(2) dl dt {background:url(./img/sub/process02_sp.jpg) no-repeat top left / auto 100%;}
  section.point:nth-of-type(2) ul li:nth-child(1) dl dt {background:url(./img/sub/process03_sp.jpg) no-repeat top left / auto 100%;}  
  section.point:nth-of-type(2) ul li:nth-child(2) dl dt {background:url(./img/sub/process04_sp.jpg) no-repeat top left / auto 100%;}
  section.point:nth-of-type(2) ul li:nth-child(3) dl dt {background:url(./img/sub/process05_sp.jpg) no-repeat top left / auto 100%;}
  section.point:nth-of-type(3) ul li:nth-child(1) dl dt {background:url(./img/sub/process06_sp.jpg) no-repeat top left / auto 100%;}
  section.point:nth-of-type(3) ul li:nth-child(2) dl dt {background:url(./img/sub/process07_sp.jpg) no-repeat top left / auto 100%;}
  
  section.point ul li dl dt img {display:none;}
  
  section.point ul li dl dd {
    width:100%;
    line-height:1.5em;
    margin:0;
    font-size:0.9em;
  }
  
  
  
  
  
  section.point:nth-of-type(4) ul li {
    width:32%;
    text-align:center;
    float:left;
    margin:0 2% 0 0;
  }
  
  section.point:nth-of-type(4) ul li:last-child {margin:0;}
  
  section.point:nth-of-type(4) ul li figure {width:100%;float:none;}
  
  div.youtube {
    position:relative;
    width:100%;
    height:auto;
    padding:56% 0 0;
    margin:0% auto 5%;
    background:#CCC;
  }
  div.movie_flow {
    margin:4% auto 8%;
  }
  div.movie_flow p {line-height: 2;}
  div.youtube iframe {
    position:absolute;
    top:0;
    width:100%;
    height:100%;
  }
  
  div.cooking div {
    font-family: "ヒラギノ明朝 ProN W6", "HiraMinProN-W6","游明朝",YuMincho,"Yu Mincho","HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
    height:auto;
    margin:0 0 1.5em;
  }
  div.cooking_more p {
    font-family: "ヒラギノ明朝 ProN W6", "HiraMinProN-W6","游明朝",YuMincho,"Yu Mincho","HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
    margin: 0;
  }
  div.cooking div:nth-last-of-type(1) {margin:0;}
  
  div.cooking span {
    display:block;
    font-size:1.2em;
    color:#714988;
    margin:0 0 0.3em;
  }

  main article ul.point_banner {margin:30px auto 30px;}
  
  main article section.matome h2 {
    font-size:16px;
    padding: 0.5em 0.75em;
    padding: 0.5em;
    background:#714988;
    color:#FFFFFF;
    margin:0 0 5%;
  }
  
  /**** 豆知識 ****/  
  
  ul.tab_menu {
    box-sizing:border-box;
    overflow:hidden;
    width:92%;
    margin:0 auto 6%;
  }
  
  ul.tab_menu li {
    box-sizing:border-box;
    position:relative;
    width:50%;
    height:40px;
    line-height:40px;
    float:left;
    text-align:center;
    font-size:1.05em;
    background:#FFF;
    color:#000;
    border:solid 1px #9577a6;
    border-right:none;
    cursor:pointer;
  }
  
  ul.tab_menu > li:nth-child(even) {border-right:solid 1px #9577a6;}
  ul.tab_menu > li:nth-child(3) ,
  ul.tab_menu > li:nth-child(4){border-top:none;}
  
  ul.tab_menu li.active {
    background:#9577a6;
    color:#FFF;
  }
  
  .tab_content {
    display:none;
    box-sizing:border-box;
    width:100%;
    height:auto;
    margin:0 auto;
  }
  
  .tab_content.active {display:block;}
  
  section.tab_content h2 {
    width:100%;
    height:auto;
    background:#ebe5ee;
    text-align:center;
    font-size:1.3em;
    color:#714988;
    margin:0 0 6%;
    padding:0.5em 0 0.4em;
  }
  
  section.tab_content dl {
    width:100%;
    margin:0 auto 8%;
    overflow:hidden;
    clear:both;
  }
  
  section.tab_content dl dt {
    width:75%;
    margin:1.5em 0 1em;
    float:right;
    font-size:1.1em;
    color:#714988;
    line-height:1.5em;
  }
  
  section.tab_content dl dd:nth-of-type(1) {
    width:22%;
    margin:0;
    float:left;
  }
  
  section.tab_content dl dd:nth-of-type(2) {
    width:100%;
    margin:0;
    clear:both;
  }
  
  article.trivia_all section.tab_content dl dd p.detail_link {
    display:block;
    width:auto;
    max-width:none;
    margin:20px 0 0;
    clear:both;
    padding:0 1em;
  }
  
  /**** よくある質問 ****/ 
  
  ul.tab_qa > li {
    width:33.3%;
    height:50px;
    font-size:14px;
    line-height:50px;
  }
  
  ul.tab_qa > li:nth-child(2) {
    line-height:1.3em;
    padding:0.5em 0 0;
    border-right:none;
  }
  
  ul.tab_qa > li:nth-child(3) {
    border-top:solid 1px #714988;
    border-right:solid 1px #714988;
  }
  
  div.qa_content {
    box-sizing:border-box;
    width:92%;
    margin:0 auto 12%;
  }
  
  div.qa_content ul.tab_qa_sub {
    position:relative;
    width:100%;
    box-sizing:border-box;
    padding:4% 0 4% 1.5em;
    margin:0 auto;
    border-bottom:solid 1px #714988;
    border-top:solid 1px #714988;
  }
  
  div.qa_content ul.tab_qa_sub li {
    list-style-type:disc;
    margin:0 auto 3%;
  }
  
  div.qa_content ul.tab_qa_sub li.active {color:#714988;text-decoration:underline;}
  
  div.qa_content dl.qa_content_sub {
    display:none;
    box-sizing:border-box;
    position:relative;
    width:100%;
    margin:40px auto;
    background:url(./img/sub/bg_qa.png) no-repeat center center /auto 90%,#ebe5ee;
  }
  
  div.qa_content dl.active {display:block;}
  
  div.qa_content dl.qa_content_sub::before {
    position:absolute;
    display:block;
    content:"";
    width:0;
    height:0;
    border-top:solid 1em #714988;
    border-left:solid 1.2em transparent;
    border-right:solid 1.2em transparent;
    margin:auto;
    top:-25px;
    left:0;
    right:0;
  }
  
  div.qa_content dl.qa_content_sub dt {
    position:relative;
    display:block;
    width:auto;
    height:auto;
    border-bottom:solid 1px #714988;
    padding:5% 5% 5% 15%;
    color:#714988;
    font-size:1.3em;
  }
  
  div.qa_content dl.qa_content_sub dt::before {
    position:absolute;
    display:block;
    content:"";
    width:10%;
    height:1.8em;
    background:url(./img/sub/bg_q.png) no-repeat center / auto 100%;
    margin:auto;
    top:-100%;
    bottom:-100%;
    left:2.5%;
  }
  
  div.qa_content dl.qa_content_sub dd {
    position:relative;
    display:block;
    width:auto;
    height:auto;
    padding:5% 5% 5% 15%;
  }
  
  div.qa_content dl.qa_content_sub dd::before {
    position:absolute;
    display:block;
    content:"";
    width:10%;
    height:2.34em;
    background:url(./img/sub/bg_a.png) no-repeat center / auto 100%;
    top:2em;
    left:2.5%;
  }
  
  div.qa_content dl.qa_content_sub dd p.detail_link {width:260px;background:none;border:solid 1px #000;margin:1em 0 0;}
  div.qa_content dl.qa_content_sub dd p.detail_link a {color:#000;}
  div.qa_content dl.qa_content_sub dd img {display:block;width:auto;margin:1em auto;}
  
  /**** 製造工程 ****/
  
  .process_box h2 {
    font-size:21px;
    line-height:1.7;
    font-weight:bold;
    color:#714987;
    margin:40px 0 20px;
  }
  .process_box p {font-size:14px;}
  .process_box .common_link {max-width: 280px;margin-bottom:40px;}
  .process_box > figure {margin: 30px auto;}
  
  
  
  
  
  div.process {
    box-sizing:border-box;
    width:100%;
    height:auto;
    margin:0 auto;
    overflow:hidden;
    background:none;
  }
  
  div.process div.process_nav_title {
    position:relative;
    width:300px;
    height:40px;
    margin:0 auto 10px;
    overflow:hidden;
    z-index:0;
    font-family: "Times New Roman" ,serif;
    font-style:italic;
    font-size:22px;
  }
  
  div.process div.process_nav_title li {height:40px;line-height:40px;}
  
  div.process div.process_nav_pict {
    position:relative;
    width:100%;
    height:auto;
    margin:0 auto 20px;
    overflow:hidden;
    z-index:0;
    padding:55% 0 0;
  } 
  
  div.process div.process_nav_text {
    box-sizing:border-box;
    position:relative;
    width:96%;
    height:180px;
    margin:0 auto;
    overflow:hidden;
    z-index:0;
    padding:0 30px;
  }  
  
  div.process ul.process_nav {
    position:absolute;
    width:1200%;
    height:auto;
    margin:0;
    text-align:center;
    top:0;
    left:0;
    z-index:0;
  }
  
  div.process ul.process_nav li {
    position:relative;
    box-sizing:border-box;
    width:calc(100% / 12);
    float:left;
  }
  
  div.process ul.process_nav li .prev {
    position:absolute;
    display:block;
    width:16px;
    height:16px;
    border-left:solid 1px #000;
    border-bottom:solid 1px #000;
    transform:rotate(45deg);
    top:0.5em;
    left:0.5em;
    z-index:1;
    cursor:pointer; 
  }
  
  div.process ul.process_nav li .next {
    position:absolute;
    display:block;
    width:16px;
    height:16px;
    border-right:solid 1px #000;
    border-top:solid 1px #000;
    transform:rotate(45deg);
    top:0.5em;
    right:0.5em;
    z-index:1;
    cursor:pointer; 
  }
  
  div.process div.process_nav_text ul.process_nav li .prev {
    top:2em;
  }
  
  div.process div.process_nav_text ul.process_nav li .next {
    top:2em;
  }

  div.process div.process_nav_text ul.process_nav li {
    padding:0 50px;
    text-align:left;
  }
  
  div.process_ctr {display:none;}
  
  /**** 配送・送料・返品について ****/
  
  div.m_box section {margin:0 auto 10%;}
  
  p.track img {width:130px;}
  
  table.area {
    width:100%;
    margin:0 auto;
  }
  
  table.area th {
    box-sizing:border-box;
    width:30%;
    background:#9577a6;
    border:solid 1px #714988;
    text-align:center;
    color:#FFF;
    height:35px;
    font-weight:normal;
    letter-spacing:0.8em;
    text-indent:0.4em;
  }
  table.area th:nth-of-type(2) {width:20%;}
  table.area th:nth-of-type(3) {
    width:50%;
    letter-spacing:0.4em;
    text-indent:0.2em;
  }
  
  table.area td {
    font-family: "ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
    box-sizing:border-box;
    border:solid 1px #714988;
    text-align:center;
    height:30px;
    font-weight:normal;
    font-weight:bold;
    padding:0.4em 0;
  }
  
  table.area td:nth-of-type(1) {color:#714988;padding:0.6em 0 0;}
  table.area td:nth-of-type(1) span {font-family:"arial",sans-serif;font-size:27px;}
  table.area td:nth-of-type(3) {
    text-align:left;
    padding:0.4em 0.5em;
    font-weight:normal;
  }
  
  div.order_date img {display:block;width:50%;margin:0 auto 10px;}
  div.order_date p:nth-of-type(1) {
    font-family: "ヒラギノ明朝 ProN W6", "HiraMinProN-W6","游明朝",YuMincho,"Yu Mincho","HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
    font-size:1.5em;
    line-height:1.3em;
    color:#a40000;
  }
  
  div.order_date p:nth-of-type(3) span {
    font-size:1.3em;
    font-weight:bold;
    margin:0 0.5em 0 0;
  } 
  ul.telfax {width:100%;overflow:hidden;}
  ul.telfax li {float:left;margin:0 1em 0 0;}
  
  /**** 薬味について ****/
  
  section.check {
    box-sizing:border-box;
    width:100%;
    margin:0 auto 5%;
  }
  
  section.condiment {
    width:92%;
    margin:0 auto 12%;
  }
  
  section.condiment h2 {width:100%;margin:10% auto 3%;}
  
  section.condiment ul {
    box-sizing:border-box;
    width:100%;
    margin:0 auto 8%;
  }
  
  section.condiment ul li {
    position:relative;
    width:100%;
    margin:0 0 3%;
    height:auto;
    padding:25% 0 0;
    z-index:0;
    color:#FFF;
    line-height:1.5em;
    background:#a58c64;
    overflow:hidden;
    font-size:3.5vw;
  }
  
  section.condiment ul li figure {
    position:absolute;
    top:-10%;
    z-index:0;
    width:27%;
    height:100%;
    margin:auto;
  }
  
  section.condiment ul li:nth-child(7n + 1) figure ,
  section.condiment ul li:nth-child(7n + 5) figure {top:0;}
  
  section.condiment ul li figure img {display:block;}
  
  section.condiment ul li dl {
    position:absolute;
    top:0;
    right:0;
    z-index:1;
    width:73%;
    height:100%;
  }
  
  section.condiment ul li dl dt {
    width:20%;
    height:100%;
    float:left;
    text-align:center;
  }
  
  section.condiment ul li dl dt img {
    width:30%;
    margin:40% auto 0;
  }

  section.condiment ul li:nth-child(8) dl dt img {
    width:70%;
    margin:40% auto 0;
  }
  
  section.condiment ul li dl dd {
    box-sizing:border-box;
    width:80%;
    height:100%;
    float:left;
    padding:10% 5% 0 0;
  }
  
  /**** お客さまの声 ****/
  
  section.voice {
    box-sizing:border-box;
    width:100%;
    margin:0 auto 8%;
    background:url(./img/sub/bg_voice.png) no-repeat center center,#ebe5ee;
  }
  
  section.voice h2 {
    box-sizing:border-box;
    width:100%;
    height:auto;
    font-size:1.4em;
    color:#714988;
    margin:0;
    padding:5%;
    border-bottom:solid 1px #714988;
  }
  
  section.voice h2 + div {
    padding:5%;
  }
  section.voice h2 + div p.customer {color:#a40000;}
  section.voice + p.common_link {margin:5% auto;}
	
  main article.voice_all p.common_link {display:inline-block;margin:0 5px 50px;width:auto;height:auto;}
  main article.voice_all p.common_link a {width:160px;height:50px;}
  
  div.pagenation {
    width:100%;
    height:auto;
    border-top:solid 1px #714988;
    border-bottom:solid 1px #714988;
    text-align:center;
    font-family:"Arial",sans-serif;
    font-size:1em;
    padding:1em 0;
    margin:0 auto 10%;
  }
  
  div.pagenation a ,
  div.pagenation span {
    display:inline-block;
    width:1.5em;
    color:#c8c8c8;
  }
  
  div.pagenation .current{
    color:#714988;
  }
  
  div.pagenation .previouspostslink,
  div.pagenation .nextpostslink {
    text-indent:-9999px;
    position:relative;
  }
  
  div.pagenation .previouspostslink::before,
  div.pagenation .nextpostslink::after {
    position:absolute;
    display:block;
    content:"";
    width:0.8em;
    height:0.8em;
    margin:auto;
    top:0;
    bottom:0;
    border-top:solid 1px #000;
  }
  
  div.pagenation .previouspostslink::before {border-left:solid 1px #000;transform:rotate(-45deg);}
  div.pagenation .nextpostslink::after {border-right:solid 1px #000;transform:rotate(45deg);}
  
  /**** お支払い方法 ****/
  
  section.payment {font-family: "ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;}
  section.payment ul.cr_card {margin:0 0 10px;}
  section.payment img {max-width:80%;}
  section.payment:nth-of-type(2) img {width:auto;max-width:none;}
  
  section.payment h2 {font-family: "ヒラギノ明朝 ProN W6", "HiraMinProN-W6","游明朝",YuMincho,"Yu Mincho","HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;}
  
  dl.payment {
    display:table;
    width:100%;
    background:#9577a6;
    overflow:hidden;
  }
  
  dl.payment dt {
    display:table-cell;
    width:7em;
    height:auto;
    font-size:1.1em;
    color:#FFF;
    text-align:center;
    vertical-align:middle;
    padding:0.5em 0;
  }
  
  dl.payment dd {
    display:table-cell;
    width:calc(100% - 8em);
    height:auto;
    font-size:1em;
    background:#ebe5ee;
    padding:0.5em;
    vertical-align:middle;
  }
  
  dl.payment dd span {
    display:inline-block;
    margin:0 0 0;
    font-size:0.9em;
  }
  
  dl.payment dd span::before {content:"※";}
  
  section.flow {margin:0 0 12%;}
  section.flow h2 {width:92%;text-align:center;margin:0 auto 10px;}
  
  section.flow ul.tab_menu li {box-sizing:border-box;width:50%;font-size:3vw;padding:0 0 0 1em;text-align:left;}
  section.flow ul.tab_menu li:nth-child(4) {border-bottom:solid 1px #9577a6;}
  section.flow ul.tab_menu li:nth-child(5) {border-top:none;border-right:solid 1px #9577a6;}
  
  section.flow section.tab_content h3 ,
  section.flow section.tab_content h4 {
    width:100%;
    height:40px;
    color:#714988;
    font-size:1.3em;
    text-align:center;
    line-height:40px;
    background:#ebe5ee;
    margin:0 0 8%;
  }
  
  section.flow section.tab_content figure {
    margin: 0 auto 8%;
  }
  section.flow section.tab_content dl {
    font-family: "ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
    width:100%;
    margin: 0 0 8%;
  }
  
  section.flow section.tab_content dl dt {
    position: relative;
    width:100%;
    font-size:18px;
    font-weight: bold;
    color:#000;
    line-height: 1.3;
    margin: 0 0 5px;
    padding: 3px 0 0px 33px;
    box-sizing: border-box;
  }
  section.flow section.tab_content dl dt::before {
    content:"";
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    width: 25px;
    height: 25px;
    background: url("./img/sub/flow_num01.svg") no-repeat center center / 100% 100%;
    vertical-align: top;
    margin: auto;
  }
  section.flow section.tab_content dl.num02 dt::before {background: url("./img/sub/flow_num02.svg") no-repeat center center / 100% 100%;}
  section.flow section.tab_content dl.num03 dt::before {background: url("./img/sub/flow_num03.svg") no-repeat center center / 100% 100%;}
  section.flow section.tab_content dl.num04 dt::before {background: url("./img/sub/flow_num04.svg") no-repeat center center / 100% 100%;}
  section.flow section.tab_content dl.num05 dt::before {background: url("./img/sub/flow_num05.svg") no-repeat center center / 100% 100%;}
  section.flow section.tab_content dl.num06 dt::before {background: url("./img/sub/flow_num06.svg") no-repeat center center / 100% 100%;}
  section.flow section.tab_content dl.num07 dt::before {background: url("./img/sub/flow_num07.svg") no-repeat center center / 100% 100%;}
  
  section.flow section.tab_content dl dd {
    width:100%;
    font-size:14px;
  }
  
  section.c_section {
    background:#ebe5ee;
    padding:0 0 5%;
  }
  
  section.c_section h2 ,
  section.c_section h3 {
    font-size:1.4em;
    color:#714988;
    padding:5%;
    border-bottom:solid 1px #714988;
    margin:0 0 5%;
  }
  
  section.c_section h2 + div ,
  section.c_section h3 + div {
    padding:0 5%;
    font-family: "ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  }
  
  ol.circle li {padding:0 0 0 1.2em;position:relative;margin:0 0 3%;}
  ol.circle li span.num {position:absolute;top:0;  left:0;}

  ol.circle li p.address {font-size:1.2em;font-weight:bold;}
  ol.circle li p.address span {display:block;font-size:1.4em;}
  
  p.dl_link {
    display:inline-block;
    width:auto;
    height:35px;
    line-height:35px;
    margin:1em 0 0;
  }
  
  p.dl_link a {
    box-sizing:border-box;
    display:block;
    width:100%;
    height:100%;
    background:#714988;
    color:#FFF;
    padding:0 1em;
  }
  
  /**** のし包装のサービス ****/
  
  section.pack {font-family: "ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;}
  
  section.pack h2 {font-family: "ヒラギノ明朝 ProN W6", "HiraMinProN-W6","游明朝",YuMincho,"Yu Mincho","HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;}
  
  section.pack ul.slider {
    width:64%;
    margin:0 auto 7%; 
  }
  
  section.pack figure {
    width:80%;
    margin:0 auto 10%;;
  }
	
  section.pack figure img {width:80%;}
  
  section.pack figure figcaption {
    font-size:0.9em;
    text-align:left;
  }
  
  section.pack div.fukuro {
    clear:both;
    background:#ebe5ee;
    padding:0.5em;
    margin:10% 0 ;
  }
  
  section.pack div.fukuro p {
    margin:0 0 5px;
  }
  
  table.noshi_type {width:100%;}
  
  table.noshi_type caption {text-align:left;}
  
  table.noshi_type th {
    height:auto;
    text-align:center;
    vertical-align:middle;
    color:#FFF;
    background:#9577a6;
    border:solid 1px #714988;
    font-weight:normal;
    font-size:1.1em;
    padding:0.5em 0;
  }
  
  table.noshi_type td {
    text-align:center;
    vertical-align:middle;
    height:auto;
    border:solid 1px #714988;
    font-weight:normal;
    line-height:1.2em;
    padding:0.5em;
  }
  
  table.noshi_type td:nth-last-of-type(3) img {width:auto;}
  table.noshi_type td:nth-last-of-type(2) {width:7em;color:#714988;font-weight:bold;}
  table.noshi_type td:nth-last-of-type(1) {text-align:left;padding:0.5em;}
  
  table.mscard {
    box-sizing:border-box;
    position:relative;
    width:99.8%;
    z-index:0;
    margin:0 auto 15%;
  }
  /*
  table.mscard::before {
    position:absolute;
    display:block;
    content:"";
    width:27%;
    height:180px;
    background:url(./img/sub/bg_mscard.png) no-repeat top right / 100% auto;
    top:0;
    right:0;
  }
  */
  table.mscard caption {
    text-align:left;
    color:#714988;
    margin:8% 0 0;
  }
  
  table.mscard caption span {
    font-size:1.2em;
    display:block;
  }
  
  table.mscard th {
    box-sizing:border-box;
    height:auto;
    text-align:center;
    vertical-align:middle;
    color:#FFF;
    background:#9577a6;
    border:solid 1px #714988;
    font-weight:normal;
    font-size:1.1em;
    padding:0.5em;
  }
  
  table.mscard th:nth-of-type(1) {
    font-size:1.5em;
    font-family: "Times New Roman" ,serif;
    font-style:italic;
  }
  
  table.mscard td {
    box-sizing:border-box;
    vertical-align:middle;
    height:auto;
    border:solid 1px #714988;
    font-weight:normal;
    line-height:1.2em;
    text-align:left;
    padding:0.5em;
  }
  
  table.mscard td:nth-of-type(1) {
    font-size:1.5em;
    font-family: "Times New Roman" ,serif;
    font-style:italic;
    color:#714988;
    text-align:center;
  }
  
  section.pack .slick-prev {
    left:-25px!important;
    transform:rotate(-135deg)!important;
  }
  section.pack .slick-next {
    right:-25px!important;
    transform:rotate(45deg)!important;
  }
  section.pack .slick-prev ,
  section.pack .slick-next {
    content:''!important;
    border-top:solid 2px #000!important;
    border-right:solid 2px #000!important;
  }

  section.pack .slick-disabled {
    border:none!important;
  }

  section.pack .slick-prev:before, .slick-next:before {content:none!important;}
  
  section p.tel_link {margin:1em 0;}
  section p.tel_link img {width:auto;display:block;margin:0 0 3%;}
  
  /**** お問い合わせ ****/ 

  section p.tel_link {margin:1em 0;}
  section p.tel_link img {width:auto;vertical-align:middle;margin:0 1em 0 0;}
  
  .table_form {
    width:100%;
    margin:0 auto 2em;
    text-align:left;
    vertical-align:middle;
  }
  
  .table_form caption {margin:0 0 30px;text-align:left;}
  
  .table_form th {
    box-sizing:border-box;
    width:100%;
    display:block;
    padding:15px 0 0 0px;
  }
  
  .table_form th span.must {position:relative;}
  .table_form th span.must::before {
    position:absolute;
    display:block;
    content:"*";
    color:#a40000;
    left:-10px;
  }
  
  .table_form td {
    box-sizing:border-box;
    display:block;
    padding:0;
    width:100%;
  }

  .table_form td a {color:#714988;text-decoration:underline;}
  .table_form td.col2 {padding:0 0 0 10px;font-weight:bold;}
  .table_form td.label {
    /*padding:15px 0;*/
  }
  
  .table_form td.label span.label {
    width:35px;
    /*display:inline-block;*/
	display:block;
    font-size:0.8em;
    /*text-align:right;*/
    padding:0 5px 0 0;
  }
  
  .table_form td.seibetsu label {width:100px;height:15px;}
  
  .table_form td input {
    box-sizing:border-box;
    width:100%;
    height:30px;
    padding:0 0.5em;
    font-size:0.9em;
    border:solid 1px #c8c8c8;
  }
  .table_form td label {width:220px;display:inline-block;float:left;margin:0 0 5px;}
  .table_form td.label input {width:160px;}
  .table_form td.label [type="radio"] {width:40px;height:15px;}
  .table_form td textarea {width:100%;height:200px;border:solid 1px #c8c8c8;}
  
  .table_form td select {
    box-sizing:border-box;
    width:110px;
    height:30px;
    margin:0;
    padding:0 0.5em;
    border:solid 1px #c8c8c8;
  } 
  .table_form td.post span.post {padding:0 0.5em}
  .table_form td.post span.abs {display:block;}
  .table_form td.post input {width:110px;}
  .table_form td.address input {margin:10px 0 0;}
  
  form input[type="button"] ,
  form input[type="submit"] {
    display:block;
    width:110px;
    height:30px;
    text-align:center;
    border:none;
    background:#714988;
    color:#FFF;
    margin:0 auto 30px;
    opacity:1;
    transition:0.5s;
    cursor:pointer;
  }
  
  form input[type="button"]:hover ,
  form input[type="submit"]:hover {
    opacity:0.6;
    transition:0.5s;
  }
  
  section.contact {margin:0 auto 15%;}
  
  /**** 新規会員登録 ****/ 
  
  section.register {
    position:relative;
    box-sizing:border-box;
    width:100%;
    margin:0 auto 8%;
    height:auto;
    padding:1em 2% 0;
  }
  
  section.register > div {
    width:100%;
    height:auto;
    margin:0;
    padding:3em 2% 4%;
    box-sizing:border-box;
    border:solid 1px #714988;
    z-index:0;
    overflow:hidden;
  }
    
  section.register div h2 {
    position:absolute;
    display:block;
    width:80%;
    height:auto;
    line-height:1.4em;
    font-size:1.5em;
    background:#FFF;
    text-align:center;
    color:#714988;
    margin:auto;
    top:0;
    left:0;
    right:0;
    z-index:1;
  }
  
  section.register div dl {
    box-sizing:border-box;
    width:100%;
    margin:0 auto 2em;
  }
    
  section.register div dl dt {
    font-size:1.3em;
    line-height:1.5em;
    color:#714988;
    margin:0 0 0.75em;
  }
  
  section.register div dl dt span {
    display:block;
    width:30%;
    margin:0 2% 0.3em;
  }
  
  section.register div dl + figure {width:70%;margin:0 auto 2em;}
  
  /**** 初回限定 ****/ 
  
  section.first {margin:10% 0 5%;}
  section.first h2 {
    box-sizing:border-box;
    width:80%;
    margin:0 auto 5%;
  }
  section.first p.free_mes {
    box-sizing:border-box;
    width:100%;
    height:auto;
    line-height:1.4em;
    font-size:1.4em;
    text-align:center;
    color:#FFF;
    background:#9577a6;
    padding:0.5em;
  }
  
  section.first p.lead {font-size:1.1em;}
  section.first div.c_box {
    width:92%;
    margin:0 auto 8%;
    background:none;
    border:solid 1px #714988;
  }
  div.camp {
    position:relative;
    width:92%;
    height:auto;
    margin:0 auto 12%;
  }
  
  div.camp p.common_link {
    position:absolute;
    margin:auto;
    left:0;
    right:0;
    bottom:0;
    height:30px;
    width:40%;
    line-height:30px;
  }
  
  div.camp p.common_link a {
    color:#FFF;
    background:#714988;
  }
  
  /**** 初回限定リニューアル（2023.11） ****/
  section.first * {
    box-sizing: border-box;
  }
  section.first img {
    vertical-align: top;
  }
  section.first h2 {
    line-height: 1.2;
    text-align: center;
    font-size: 90px;
    font-size: min(90px,9.5vw);
    font-weight: 600;
    color: #a40000;
    letter-spacing: 0;
  }
  section.first h2 span {
    display: block;
    font-size: 65px;
    font-size: min(65px,7.8vw);
  }
  section.first p.free_mes {
    margin: 0;
  }
  section.first .bg {
    padding: 50px 0;
  }
  section.first .bg.bg1 {
    padding-top: 30px;
    background: url(./img/sub/first_bg01.png) no-repeat center top / contain;
  }
  section.first .bg.bg2 {
    background: url(./img/sub/first_bg02.png) no-repeat center top / contain;
  }
  section.first .bg.bg3 {
    background: url(./img/sub/first_bg03.png) no-repeat center top / contain;
  }
  section.first .bg .lead {
    font-size: 16px;
    font-weight: 500;
    margin: 0 auto;
  }
  section.first .first_box {
    width: 100%;
    padding: 0 5%;
    margin: auto;
  }
  section.first .item_cont {
    padding: 25px 5%;
    background: #fff;
    border-radius: 10px;
    box-shadow: 0px 5px 10px 0px rgba(0,0,0,0.2);
  }
  section.first .item_cont .fukidashi {
    text-align: center;
    margin: 0 0 20px;
  }
  section.first .item_cont .fukidashi span {
    position: relative;
    z-index: 0;
    display: inline-block;
    padding: 5px 20px 3px;
    color: #fff;
    background: #9577a6;
    font-size: 18px;
  }
  section.first .item_cont .fukidashi span::before {
    content: "";
    position: absolute;
    display: block;
    bottom: -9px;
    left: 0;
    right: 0;
    margin: auto;
    width: 25px;
    height: 10px;
    background: #9577a6;
    clip-path: polygon(50% 100%, 0 0, 100% 0);
  }
  section.first .item_cont .item_title {
    line-height: 1.4;
    text-align: center;
    padding-bottom: 15px;
    border-bottom: 1px solid #9577a6;
    margin: 0 0 20px;
  }
  section.first .item_cont .item_title .sub {
    display: block;
    font-size: 25px;
    font-weight: 600;
    color: #a40000;
  }
  section.first .item_cont .item_title .main {
    display: block;
    font-size: 42px;
    font-weight: 600;
    color: #9577a6;
  }
  section.first .item_cont .item_title .main + .sub {
    color: #9577a6;
  }
  section.first .item_cont .item_lead {
    font-weight: 400;
    font-size: 16px;
    line-height: 2;
  }
  section.first .item_cont .columns_cont {
  }
  section.first .item_cont .columns_cont > .columns_fig {
    max-width: 90%;
    margin: 0 auto 20px;
  }
  section.first .item_cont .columns_cont > .columns_item {
  }
  section.first .item_cont .columns_cont .tokubetsu {
    color: #714988;
    text-align: center;
    font-size: 18px;
    line-height: 1.3;
    font-weight: 600;
    background: url(./img/sub/first_fukidashi.svg) no-repeat center bottom / 100% auto;
    padding-bottom: 18px;
    margin: 0 0 10px;
  }
  section.first .item_cont .columns_cont .price {
    color: #a40000;
    font-weight: 600;
    font-size: 50px;
    line-height: 1;
    margin: 0 0 20px;
  }
  section.first .item_cont .columns_cont .price > img {
    width: 50px;
    vertical-align: bottom;
    margin-right: 0.1em;
  }
  section.first .item_cont .columns_cont .price .tax {
    font-size: 20px;
  }
  section.first .item_cont .columns_cont .name {
    font-size: 20px;
    font-weight: 600;
    line-height: 1.3;
    margin: 0 0 20px;
  }
  section.first .item_cont .columns_cont .spec {
    font-size: 16px;
    line-height: 1.3;
    padding: 10px 0;
    border-top: 1px solid #714988;
    border-bottom: 1px solid #714988;
  }
  section.first .item_cont p.common_link {
    max-width: 320px;
    height: auto;
    margin: 30px auto 0;
  }
  section.first .item_cont p.common_link a {
    font-family: inherit;
    background: #a40000;
    color: #fff;
    font-size: 20px;
    padding: 10px 0;
    height: auto;
  }
  section.first .separate_bg {
    width: 100%;
    max-height: 420px;
    overflow: hidden;
    margin: 0;
  }
  
  /**** キャンペーン ****/ 
  
  section.campaign h2 {
    box-sizing:border-box;
    width: 92%;
    margin: 0 auto 6%;
  }  
  
  section.campaign div.free_mes {
    width:100%;
    height:auto;
    padding:5px 0;
    margin:0;
    text-align:center;
    color:#fff;
    background:#d45157;
  }
  
  section.campaign div.free_mes p {
    position:relative;
    box-sizing:border-box;
    width:96%;
    padding:0.3em 8em 0.3em 2%;
    height:auto;
    line-height:1.2em;
    font-size:1.2em;
    margin:0 auto;
    text-align:left;
  }
  
  section.campaign div.free_mes p > span {
    display:block;
    width:4em;
    height:auto;
    line-height:1.2em;
    padding:0.25em 0.25em;
    font-size:0.9em;
    color:#fff;
    background:#004566;
    margin:0 0.5em 0.3em 0;
  }
  
  section.campaign div.free_mes p::after {
    position:absolute;
    display:block;
    content:"";
    width:8em;
    height:0%;
    padding: 6.5em 0 0;
    background:url(./img/campaign/free_mes_after.png) no-repeat center right/ auto 100%;
    margin:auto;
    top:0%;
    bottom:0;
    right:0;
  }
  
  section.campaign div.camp {
    padding:5% 0 40px;
    background: #FFFFFF;
    background: -moz-linear-gradient( #fcf1f2 0%, #FFFFFF 100%);
    background: -webkit-gradient(linear, left top, left bottom, from(#fcf1f2), to(#FFFFFF));
    background: -webkit-linear-gradient( #fcf1f2 0%, #FFFFFF 100%);
    background: -o-linear-gradient( #fcf1f2 0%, #FFFFFF 100%);
    background: -ms-linear-gradient( #fcf1f2 0%, #FFFFFF 100%);
    background: linear-gradient( #fcf1f2 0%, #FFFFFF 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr=#fcf1f2, endColorstr=#FFFFFF,GradientType=0 );
  }
  
  section.campaign div.camp > div {
    width:96%;
    margin:0 auto;
    overflow:hidden;
  }
  section.campaign div.camp > div > figure {margin:5% auto;}
  section.campaign div.camp .set_mes {
    position:relative;
    box-sizing:border-box;
    width:100%;
    height:auto;
    margin:0 0 5%;
    padding: 0.5em 5em 0.4em 4%;
    font-size:1.1em;
    line-height:1.3em;
    color:#fff;
    background:#004566;
  }
  
  section.campaign div.camp .set_mes::after {
    content: "";
    position:absolute;
    display:block;
    width:5em;
    height:5em;
    margin:auto;
    top:0;
    bottom:0;
    right:0;
  }
  section.campaign div.camp .set_mes.camp01::after {background: url("./img/campaign/set_mes01_after.png") no-repeat center center / cover;}
  section.campaign div.camp .set_mes.camp02::after {background: url("./img/campaign/set_mes02_after.png") no-repeat center center / cover;}
  
  section.campaign div.camp .camp_price {
    width:100%;
    margin:0 auto 3%;
    text-align:center;
  }
  
  section.campaign div.camp .camp_set {
    width:100%;
    margin:0 auto 3%;
    text-align:center;
  }
  
  section.campaign div.camp p.common_link a {
    background:#004566;
  }
  /* 秋キャンペーン */  
  section.camp_autumn div.camp {
    background: -moz-linear-gradient( #fcf4ee 0%, #FFFFFF 100%);
    background: -webkit-gradient(linear, left top, left bottom, from(#fcf4ee), to(#FFFFFF));
    background: -webkit-linear-gradient( #fcf4ee 0%, #FFFFFF 100%);
    background: -o-linear-gradient( #fcf4ee 0%, #FFFFFF 100%);
    background: -ms-linear-gradient( #fcf4ee 0%, #FFFFFF 100%);
    background: linear-gradient( #fcf4ee 0%, #FFFFFF 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr=#fcf4ee, endColorstr=#FFFFFF,GradientType=0 );
  }

  section.camp_autumn div.free_mes {background:#b51018;}
  
  section.camp_autumn div.free_mes p {color:#fff;padding:0.3em 4em 0.3em 2%;}
  
  section.camp_autumn div.free_mes p > span {background:#fff;color:#b51018;}
  
  section.camp_autumn div.free_mes p::after {
    width: 115px;
    height:0;
    padding:5.3em 0 0;
    background:url(./img/campaign/free_mes_after_a.png) no-repeat center / contain;
  }
  
  section.camp_autumn div.camp .set_mes {
    background:#5d3220;
    color:#fff;
    font-weight: 700;
  }
  section.camp_autumn div.camp p.common_link a {
    background:#b51018;
  }
  section.camp_autumn div.camp .set_mes.camp01::after {background: url("./img/campaign/set_mes01_after_a.png") no-repeat center center / contain;}
  section.camp_autumn div.camp .set_mes.camp02::after {background: url("./img/campaign/set_mes02_after_a.png") no-repeat center center / contain;}
  
  section.camp_autumn p.lead{font-weight: 500;}
  
  
  
  /**** レシピ一覧 ****/ 
  
  div.recipe_nav {
    width:100%;
    height:150px;
  }
  div.recipe_nav ul.tab_menu {margin:0 auto 20px;}
  div.recipe_nav ul.tab_menu li {width:calc(100% / 3);border-top:solid 1px #9577a6;border-right:none;}
  div.recipe_nav ul.tab_menu li:last-child {border-right:solid 1px #9577a6;}
  div.recipe_nav ul.tab_menu li a{display:block;width:100%;height:100%;}
  div.recipe_nav div.tab_content {
    width:100%;
    height:40px;
    bottom:0;
    background:#ebe5ee;
  }
  
  div.recipe_nav div.tab_content ul {
    box-sizing:border-box;
    width:92%;
    height:100%;
    margin:0 auto;
    text-align:center;
    font-size:0;
  }
  
  div.recipe_nav div.tab_content ul li {
    width:25%;
    position:relative;
    display:inline-block;
    text-align:center;
    height:40px;
    line-height:40px;
    margin:0;
    padding:0;
    font-size:14px;
  }
  
  div.recipe_nav div.tab_content ul li:nth-child(3) {width:50%;}
  
  div.recipe_nav div.tab_content ul li::before {
    position:absolute;
    display:block;
    content:"";
    width:1px;
    height:20px;
    background:#9577a6;
    margin:auto;
    top:0;
    bottom:0;
    left:0;
  }
  
  div.recipe_nav div.tab_content ul li:last-child::after {
    position:absolute;
    display:block;
    content:"";
    width:1px;
    height:20px;
    background:#9577a6;
    margin:auto;
    top:0;
    bottom:0;
    right:0;
  }
  
  div.recipe_nav div.tab_content ul li a {
    display:block;
    width:100%;
    height:100%;
    color:#000;
  }
  
  div.recipe_nav div.tab_content ul li a:hover,
  div.recipe_nav div.tab_content ul li a.current {color:#714988;}
  
  ul.recipe_all {
    width:100%;
    margin:0 auto 10%;
    overflow:hidden;
    font-family: "ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
    clear:both;
  }
  
  ul.recipe_all > li {
    position:relative;
    width:100%;
    margin:0 auto 2%;
    height:auto;
    color:#000;
    font-size:2.4vw;
    line-height:1.5em;
    background:#f5faf0;
    overflow:hidden;
  }
  
  ul.recipe_all > li figure {
    width:30%;
    margin:0;
    float:left;
    overflow:hidden;
  }
  
  ul.recipe_all > li figure img {
    display:block;
  }
  
  ul.recipe_all > li dl {
    width:70%;
    height:100%;
    float:left;
  }
  
  ul.recipe_all > li dl dt {
    width:100%;
    font-size:14px;
    font-weight:bold;
    margin:1em 5% 0.5em;
  }

 ul.recipe_all > li dl dd {
    width:90%;
    margin:0 5% 5%;
	font-size:13px;
  }

  ul.recipe_all > li dl dd ul {
    position:absolute;
    height:2.4em;
    bottom:5px;
    right:5px;
	font-size:12px;
  }
  
  ul.recipe_all > li dl dd:last-child ul li {
    display:inline-block;
    width:2.4em;
    height:2.4em;
    background:#78c38c;
    border-radius:50%;
  }
  
  ul.r_hot > li {background:#f7e9f2;}
  ul.r_cold > li {background:#ecf2fa;}
  ul.st_jp > li {background:#f5faf0;}
  ul.st_ws > li {background:#fff0eb;}
  ul.st_ch > li {background:#faf0d7;}
  ul.r_sp > li {background:#eee6da;}
  
  ul.r_hot > li dl dd:last-child ul li {background:#d9a4c9;}
  ul.r_cold > li dl dd:last-child ul li {background:#73afdf;}
  ul.st_jp > li dl dd:last-child ul li {background:#78c38c;}
  ul.st_ws > li dl dd:last-child ul li {background:#ef8861;}
  ul.st_ch > li dl dd:last-child ul li {background:#e6be46;}
  ul.r_sp > li dl dd:last-child ul li {background:#ab834a;}
  
  ul.cat_recipe {
    width:100%;
    height:auto;
    overflow:hidden;
    margin:0 auto 10%;
  }
  
  ul.cat_recipe li {
    width:100%;
    height:auto;
    margin:0 0 3%;
    font-family: "ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;

  }
  
  ul.cat_recipe li img {display:block;width:58%;}
  ul.cat_recipe li.st_jp {background:#f5faf0;}
  ul.cat_recipe li.st_ws {background:#fff0eb;}
  ul.cat_recipe li.st_ch {background:#faf0d7;}
  
  ul.cat_recipe li a {
    display:block;
    width:100%;
    height:100%;
    color:#505050;
    text-align:center;
    font-weight:bold;
  }
  
  ul.cat_recipe li p {
    display:block;
    width:42%;
    float:left;
    line-height:1.3em;
    padding:9% 0 0;
    margin:0;
    font-size:0.9em;
  }
  
  ul.cat_recipe  li.st_ch p {padding:7% 0 0;}
  
  /**** レシピ個別 ****/ 
  
  div.recipe_single {font-family: "ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;}
  div.recipe_single .breadcrumbs {padding:0;margin:0 0 30px;font-family: "ヒラギノ明朝 ProN W6", "HiraMinProN-W6","游明朝",YuMincho,"Yu Mincho","HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;}
  
  div.recipe_single h1 {
    width:100%;
    height:auto;
    line-height:1.3em;
    font-size:1.5em;
    margin:0 auto 5%;
    padding:0 0 0.3em;
    border-bottom:solid 2px #714988;
    overflow:hidden;
  }
  
  div.recipe_single h1 span {
    display:inline-block;
    width:auto;
    float:left;
  }
  div.recipe_single h1 span:nth-of-type(2) {
    font-size:0.9em;
    float:right;
  }
  
  div.recipe_single h1 span:nth-of-type(2)::before {display:inline-block;width:3em;height:1em;content:"";background:url(./img/recipe/r_before.png) no-repeat left center/100%;margin:0 0.5em 0 0;}
  div.recipe_single h1 span:nth-of-type(2)::after {display:inline-block;width:3em;height:1em;content:"";background:url(./img/recipe/r_after.png) no-repeat right center/100%;margin:0 0 0 0.5em;}
  
  div.recipe_single > figure {width:80%;;margin:0 auto 3%;}
  div.recipe_detail {width:100%;;margin:0 auto 5%;}
  div.recipe_detail p.qrc {display:none;}
  
  div.recipe_detail dl {
    width:100%;
    clear:both;
    overflow:hidden;
    margin:0 auto 3%;
    border-bottom:solid 1px #c8c8c8;
  }
  
  div.recipe_detail dl dt {
    box-sizing:border-box;
    width:40%;
    color:#714988;
    float:left;
    border-top:solid 1px #c8c8c8;
    padding:2% 0 2% 0.5em;
  }
  
  div.recipe_detail dl dd {
    box-sizing:border-box;
    width:60%;
    font-size:1.1em;
    color:#714988;
    font-weight:bold;
    float:left;
    border-top:solid 1px #c8c8c8;
    text-align:right;
    padding:2% 0.5em 2% 0;
  }
  
  div.recipe_detail dl dd span {
    font-size:0.9em;
    display:block;
    font-weight:normal;
  }
  
  div.recipe_detail dl dt:nth-of-type(1) {border:none;}
  
  div.recipe_detail dl dd:nth-of-type(1) {border:none;}
  
  div.recipe_detail ul {
    width:100%;
    overflow:hidden;
    margin:0 0 4%;
    text-align:center;
  }
  
  div.recipe_detail ul li {
    box-sizing:border-box;
    display:inline-block;
    width:12.5%;
    height:40px;
    
  }
  
  div.recipe_detail ul li:nth-child(3) ,
  div.recipe_detail ul li:nth-child(4) {
    display:none;
  }
  
  div.recipe_detail p.product_this {
    width:100%;
    font-size:1.3em;
    font-weight:bold;
    text-align:center;
    color:#714988;
    margin:0 auto 2%;
  }
  
  div.recipe_detail p.product_this + div {
    box-sizing:border-box;
    width:100%;
    height:auto;
    overflow:hidden;
    background:#ebe5ee;
    padding:2%;
    margin:0 auto 3%;
  }
  
  div.recipe_detail p.product_this + div img {width:35%;float:left;}
  div.recipe_detail p.product_this + div p {width:62%;float:left;}
  div.recipe_detail p.product_this + div p:nth-of-type(1) {font-size:1.2em;font-weight:bold;margin:5px 0;}
  div.recipe_detail p.product_this + div p.detail_link {font-size:0.9em;background:#FFF;width:8em;float:none;clear:both;}
  
  section.recipe_single h2 {
    width:100%;
    height:auto;
    line-height:1.3em;
    font-size:1.4em;
    margin:0 auto 3%;
    padding:0 0 0.3em;
    border-bottom:solid 2px #714988;
    overflow:hidden;
  }
  
  section.material dl {
    width:100%;
    clear:both;
    overflow:hidden;
    margin:0 auto 10px;
  }
  
  section.material dl dt {
    box-sizing:border-box;
    width:70%;
    float:left;
    border-top:solid 1px #c8c8c8;
    padding:15px 0  5px 0.5em;
    min-height:34px;
  }
  
  section.material dd {
    box-sizing:border-box;
    width:30%;
    float:left;
    border-top:solid 1px #c8c8c8;
    text-align:right;
    padding:15px 0.5em 5px 0;
    min-height:34px;
  }
  
  section.material h2 + dl {padding:0;}
  section.material h2 + dl dt ,
  section.material h2 + dl dd {border:none;}
  section.material dl + h2 {border-top:solid 1px #c8c8c8;padding:15px 0 5px;margin:10px auto 5px;}
  section.material dl:nth-last-of-type(1) {margin:0 0 15px;border-bottom:solid 1px #c8c8c8;}
  
  
  
  section.cookflow ol {width:100%;margin:0 auto 5%;}
  section.cookflow ol li {
    position:relative;
    width:85%;
    height:auto;
    padding:1em 0 1em 15%;
    border-bottom:solid 1px #c8c8c8;
  }
  
  section.cookflow ol li::before {
    box-sizing:border-box;
    position:absolute;
    display:block;
    margin:auto;
    top:0;
    bottom:0;
    left:0;
    font-size:1.8em;
    width:1.2em;
    height:1.2em;
    line-height:1em;
    font-weight:bold;
    color:#714988;
    border:solid 2px #714988;
    text-align:center;
    border-radius:50%;
  }
  
  section.cookflow ol li:nth-child(1)::before {content:"1";}
  section.cookflow ol li:nth-child(2)::before {content:"2";}
  section.cookflow ol li:nth-child(3)::before {content:"3";}
  section.cookflow ol li:nth-child(4)::before {content:"4";}
  section.cookflow ol li:nth-child(5)::before {content:"5";}
  section.cookflow ol li:nth-child(6)::before {content:"6";}
  section.cookflow ol li:nth-child(7)::before {content:"7";}
  section.cookflow ol li:nth-child(8)::before {content:"8";}
  section.cookflow ol li:nth-child(9)::before {content:"9";}
  section.cookflow ol li:nth-child(10)::before {content:"10";}
  
  div.recomend_product {
    box-sizing:border-box;
    width:100%;
    height:auto;
    overflow:hidden;
    padding:2%;
    border:solid 1px #714988;
    margin:0 auto 8%;
  }
  
  div.recomend_product > img {display:block;width:40%;margin:0 auto 2%;}
  div.recomend_product > div > p:nth-of-type(1) {
    font-family: "ヒラギノ明朝 ProN W6", "HiraMinProN-W6","游明朝",YuMincho,"Yu Mincho","HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
    font-size:1.2em;
    margin:0 0 2%;
  }
  
  div.recomend_product > div > p:nth-of-type(1) span {color:#714988;}
  div.recomend_product > div > p:nth-of-type(2) {font-size:0.9em;}
  
  div.recomend_product > div > div {font-family:"ヒラギノ明朝 ProN W6", "HiraMinProN-W6","游明朝",YuMincho,"Yu Mincho","HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;}
  div.recomend_product > div > div p.price {font-size:1.3em;margin:0 0 3%;}
  div.recomend_product > div > div p.price span {font-size:2em;font-family: "Times New Roman" ,serif;}
  div.recomend_product > div > div p.tax_off {margin:0 auto 3%;}
  div.recomend_product > div div.to_cart span {float:left;margin:15px 0 0;font-size:1.4em;}
  div.recomend_product > div > div select {float:left;margin:15px 10px 15px 0;font-size:1.4em;}
  div.recomend_product > div > div p.to_cart {width:85%;float:left;max-width:200px;margin:0;}
  div.recomend_product > div > div p.to_cart input {width:100%;height:auto;}
  
  section.recomend h2 {margin:0 0 5%;}
  section.recomend ul {width:100%;margin:0 auto 5%;overflow:hidden;}
  section.recomend ul li {width:32%;float:left;margin:0 2% 2% 0;}
  section.recomend ul li:nth-child(3n) {margin:0 0 2%;}
  section.recomend ul li:nth-child(3n + 1) {clear:both;}
  section.recomend ul li p {line-height:1.4em;font-weight:bold;}
  
  /** ギフトカテゴリー **/
  
  main article.gift_category .box {width:94%;}
  main article.gift_category > div.title_area {padding:40% 0 0;}
  main article.gift_category > div.title_area h1 {height:30%;padding:0 6%;}
  
  main article > div.gift_list {background:url(./img/h1/bg_gift_list.png) center center / cover;}
  main article > div.gift_baby {background:url(./img/h1/bg_gift_baby.png) center center / cover;}
  main article > div.gift_house {background:url(./img/h1/bg_gift_house.png) center center / cover;}
  main article > div.gift_birthday {background:url(./img/h1/bg_gift_birthday.png) center center / cover;}
  main article > div.gift_admission {background:url(./img/h1/bg_gift_admission.png) center center / cover;}
  main article > div.gift_marriage {background:url(./img/h1/bg_gift_marriage.png) center center / cover;}
  main article > div.gift_kanreki {background:url(./img/h1/bg_gift_kanreki.png) center center / cover;}
  main article > div.gift_return {background:url(./img/h1/bg_gift_return.png) center center / cover;}
  main article > div.gift_prize {background:url(./img/h1/bg_gift_prize.png) center center / cover;}
  main article > div.gift_parents {background:url(./img/h1/bg_gift_parents.png) center center / cover;}
  main article > div.gift_kaiki {background:url(./img/h1/bg_gift_kaiki.png) center center / cover;}
  main article > div.gift_hikidemono {background:url(./img/h1/bg_gift_hikidemono.png) center center / cover;}
  main article > div.gift_ochugen {background:url(./img/h1/bg_gift_ochugen.png) center center / cover;}
  main article > div.gift_greeting {background:url(./img/h1/bg_gift_greeting.png) center center / cover;}
  main article > div.gift_keirou {background:url(./img/h1/bg_gift_keirou.png) center right 25% / cover;}
  main article > div.gift_shichigosan {background:url(./img/h1/bg_gift_shichigosan.png) center center / cover;}
  main article > div.gift_oseibo {background:url(./img/h1/bg_gift_oseibo.png) center center / cover;}
  
  p.gift_list {
    font-size:1em;
    width:100%;
    margin:0 auto 6%;
  }
  ul.gift_list {
    width:100%;
    margin:0 auto 10%;
    overflow:hidden;
  }
  ul.gift_list:nth-of-type(1) {margin:0 auto;}
  ul.gift_list li {
    width:100%;
    margin:0 auto 5%;
  }
  ul.gift_list:nth-of-type(2) li {
    width:48%;
    margin:0 4% 5% 0;
    float:left;
  }
  ul.gift_list:nth-of-type(2) li:nth-child(even) {margin:0 0 5%;}
  ul.gift_list:nth-of-type(2) li:nth-child(odd) {clear:both;}
  
  section.gift_head {
    width:100%;
    margin:0 auto 10%;
  }
  section.gift_head h2 {
    font-size:2em;
    font-weight:bold;
    line-height:1.5;
    color:#da7482;
    text-align:center;
    margin:0 auto 5%;
  }
  .gift_blue section.gift_head h2 {color:#677fc4;}
  section.gift_head .button_gift {
    width:200px;
    height:40px;
    line-height:40px;
    text-align:center;
    margin:0 auto 10%;
  }
  section.gift_head .button_gift a {
    display:block;
    width:100%;
    height:100%;
    color:#FFFFFF;
    background:#da7482;
  }
  .gift_blue section.gift_head .button_gift a {background:#677fc4;}
  section.gift_head h3 {
    font-size:1.4em;
    line-height:1.5;
    margin:0 auto 5%;
    color:#da7482;
    font-weight:bold;
    clear:both;
  }
  .gift_blue section.gift_head h3  {color:#677fc4;}
  section.gift_head p.right {
    width:100%;
    text-align:right;
    margin:0 0 8%;
  }
  section.gift {
    width:100%;
    margin:0 auto 10%;
  }
  section.gift h2 {
    font-size:1.6em;
    font-weight:bold;
    line-height:1.5;
    color:#da7482;
    text-align:center;
    margin:0 auto 5%;
  }
  .gift_blue section.gift h2 {color:#677fc4;}
  section.gift ul {
    width:100%;
    margin:0 auto;
    overflow:hidden;
  }
  section.gift ul li {
    width:49%;
    margin:0 2% 2% 0;
    float:left;
  }
  section.gift ul li:nth-child(even) {margin:0 0 2%;}
  section.gift ul li img {display:block;}
  section.gift_recipe figure {
    width:80%;
    margin:0 auto 5%;
  }
  section.gift_recipe h3 {
    font-size:1.4em;
    text-align:center;
    color:#da7482;
    margin:0 auto 3%;
  }
  .gift_blue section.gift_recipe h3 {color:#677fc4;}
  section.gift_recipe h3 + p {
    margin:0 0 6%;
  }
  section.gift_recipe ul {
    width:50%;
    float:left;
    margin:0 0 6%;
  }
  section.gift_recipe ul li {
    width:100%;
    text-indent:2em;
    float:none!important;
    margin:0;
  }
  .gift_category h2.h2_mark {color:#714987;}
  section.gift_ranking {
    margin:0 auto 10%;
  }
  section.gift_ranking ul {overflow:hidden;}  
  section.gift_ranking ul li {
    width:96%;
    padding:0 0 6%;
    margin:0 auto 10%;
    border-bottom:solid 1px #714987;
  }  
  section.gift_ranking ul li:nth-last-child(1) {margin:0;} 
  section.gift_ranking ul li figure {
    position:relative;
    margin:0;
    z-index:0;
  }
  section.gift_ranking ul li figure:nth-child(1)::before {
    position:absolute;
    display:block;
    width:15%;
    height:30%;
    content:"";
    top:0;
    left:10%;
    z-index:1;
  }
  section.gift_ranking ul li:nth-child(1) figure::before {background:url(img/index/rank01_before.png) no-repeat center / cover;}
  section.gift_ranking ul li:nth-child(2) figure::before {background:url(img/index/rank02_before.png) no-repeat center / cover;}
  section.gift_ranking ul li:nth-child(3) figure::before {background:url(img/index/rank03_before.png) no-repeat center / cover;}
  section.gift_ranking ul li dl dt {
    font-family: "ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
    font-size:1.3em;
    font-weight:bold;
    color:#714987;
    margin:0 0 3%;
  }
  section.gift_ranking ul li dl dd p.ranking_content {
    box-sizing:border-box;
    width:100%;
    height:auto;
    font-size:1.1em;
    padding:0.5em 1em;
    background:#eeeeee;
  }
  section.gift_ranking ul li dl dd p.price_tax {
    font-family: "ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
    font-weight:bold;
  }
  section.gift_ranking ul li dl dd p.price_tax span {
    display:inline-block;
    vertical-align:middle;
  }
  section.gift_ranking ul li dl dd p.price_tax span span {vertical-align:bottom;}
  section.gift_ranking ul li dl dd p.price_tax span:nth-of-type(2) {  
    color:#961e00;
    font-size:2em;
  }
  section.gift_ranking ul li dl dd p.price_tax span:nth-of-type(3) {
    color:#961e00;
    margin:0 0 0 0.5em;
  }
  section.gift_ranking ul li dl dd p:nth-last-of-type(1) {display:none;}
  
  section.gift_ranking ul li .ranking_link {
    width:170px;
    height:35px;
    line-height:35px;
    text-align:center;
    margin:6% auto;
  }
  section.gift_ranking ul li .ranking_link a {
    display:block;
    width:100%;
    height:100%;
    background:#ebe5ee;
  }
  section.gift_ranking ul li .ranking_link a:hover {background:#c5b4ce;}
  .gift_category .index_voice .box {
    width:100%;
    padding:0;
  }
  .gift_category .product_banner {padding:0;width:100%;}
  .gift_category .product_banner + div.clear {margin:10% auto;}
  .gift_category .center_lead {
    font-size:1.3em;
    font-weight:bold;
    text-align:center;
    margin:8% auto;
  }
  section.gift_reason {
    width:100%;
    margin:0 auto 10%;
  }
  section.gift_reason h2 {
    font-size:1.7em;
    text-align:center;
    margin:0 auto 6%;
    line-height:1.5;
    color:#714987;
    font-weight:bold;
  }
  section.gift_reason dl dt {
    position:relative;
    width:100%;
    height:40px;
  }
  section.gift_reason dl dt::after {
    position:absolute;
    display:block;
    content:"";
    width:100%;
    height:1px;
    background:#714987;
    margin:auto;
    top:0;
    bottom:0;
    left:0;
    z-index:0;
  }
  section.gift_reason dl dt span {
    height:40px;
    display:inline-block;
    padding:0 10px 0 0;
    background:#FFFFFF;
    position:absolute;
    top:0;
    left:0;
    z-index:1;
  }
  section.gift_reason dl dt span img {height:40px;}
  section.gift_reason dl dd {
    width:100%;
    padding:20px 0 30px;
    margin:0 0 30px;
    text-align:center;
    font-size:1.3em;
    font-weight:bold;
    border-bottom:solid 1px #714987;
  } 
  section.gift_reason + ul {
    overflow:hidden;
    margin:0 auto 10%;
  }
  section.gift_reason + ul li {
    width:100%;
    margin:0 0 3%;
  }
  section.gift_reason + ul li:last-child {margin:0;}
  
  /*注文用紙ページ*/
  main article > div.order {background:url(./img/h1/bg_order_sheet.png) center center / cover;}
  main article h2.h2_line {
    width:100%;
    height:auto;
    text-align:center;
    margin:0 auto 16px;
    font-size:24px;
    color:#714987;
    line-height: 1.7;
  }
  main article h2.h2_line span {
    position:relative;
    display: inline-block;
    width:auto;
    max-width:80%;
  }
  main article h2.h2_line span::before,
  main article h2.h2_line span::after {
    content: "";
    display: inline-block;
    position: absolute;
    top:50%;
    width: 2em;
    height: 1px;
    margin: 0 0.5em;
    background: #714987;
  }
  main article h2.h2_line span::before {left:-3em;}
  main article h2.h2_line span::after {right:-3em;}
  main article h2.h2_line + p {text-align: center; margin: 0 0 50px; font-size: 14px;}
  main article.order_sheet .box {
    box-sizing:border-box;
    width:100%;
    max-width:1000px;
    height:auto;
    overflow:hidden;
    margin:0 auto;
    padding:0 20px;
    clear:both;
  }
  .order_sheet figure.order_top {margin: 0 0 50px;}
  .order_sheet section[id^="order_"] {
    padding:100px 0 0;
    margin:-100px auto 50px;
  }
  .order_sheet section[id^="order_"] ol {
    width:100%;
    margin:auto;
    overflow:hidden;
  }
  .order_sheet section[id^="order_"] ol li {
    width:100%;
  }
  .order_sheet section[id^="order_"] ol li img {
    display:block;
    width:100%;
  }
  .order_sheet section[id^="order_"] ol li p {
    position:relative;
    padding:20px 0 20px 50px;
    font-size:13px;
  }
  .order_sheet section[id^="order_"] ol li p span {
    font-family: "ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
    position:absolute;
    display:block;
    width:40px;
    height:40px;
    border:solid 1px #714987;
    border-radius:50%;
    color:#714987;
    text-align:center;
    font-size:32px;
    line-height:43px;
    font-weight:bold;
    margin:auto;
    top:0;
    bottom:0;
    left:0;
  }
  .order_sheet section[id^="order_"] p.detail span {
    font-size: 18px;
    color: #714987;
    font-weight: bold;
  }
  .order_sheet section[id^="order_"] .index_menu{margin: 0 0 35px;}
  .order_sheet section[id^="order_"] .destination{
    text-align: center;
    font-family: "ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
    margin: 3em 0 0;
  }
  .order_sheet section[id^="order_"] .destination span {
    position: relative;
    top: -15px;
  }
  .order_sheet section[id^="order_"] .destination a{
    font-size: 20px;
    font-weight: bold;
    text-decoration: underline;
  }
  .order_sheet section[id^="order_"] .destination img{
    position: relative;
    left: 5px;
    width: 200px;
  }
  .order_sheet section.how_sheet{margin: 0 0 4em;}
  .order_sheet section.how_sheet h2{
    font-size: 24px;
    text-align: center;
    margin: 0 0 0.5em;
    line-height: 1.7;
  }
  .order_sheet section.how_sheet h2 span {
    position: relative;
    display: inline-block;
    max-width: 80%;
  }
  .order_sheet section.how_sheet h2 span::before,
  .order_sheet section.how_sheet h2 span::after {
    content: "";
    position: absolute;
    display: block;
    top: 50%;
    width: 480px;
    height: 1px;
    margin: 0 0.5em;
    background: #000;
  }
  .order_sheet section.how_sheet h2 span::before {left: 100%;}
  .order_sheet section.how_sheet h2 span::after {right:  100%;}
  .order_sheet section.how_sheet .front_back {font-size: 20px; font-weight: bold; margin: 0 0 0.5em;}
  .order_sheet section.how_sheet figure{margin: 0 0 3em;}
  .order_sheet section.how_sheet figure:nth-of-type(2){margin: 0 0 6em;}
  .order_sheet section.how_sheet ol.sheet_flow{
    counter-reset:number;
    width: 100%;
    margin: auto;
  }
  .order_sheet section.how_sheet ol.sheet_flow li{
    position: relative;
    font-size: 14px;
    padding: 0 0 0 2.5em;
    margin: 0 0 3em;
  }
  .order_sheet section.how_sheet ol.sheet_flow li span:nth-of-type(1),
  .order_sheet section.how_sheet ol.sheet_flow li span.num_pair {
    font-family: "ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
    position: absolute;
    left: 0;
    width: 25px;
    height: 25px;
    line-height: 28px;
    color: #4189C5;
    font-size: 18px;
    font-weight: bold;
    text-align:center;
    border: 1px solid #4189C5;
    border-radius: 50%;
  }
  .order_sheet section.how_sheet ol.sheet_flow li span.num_pair {top: 1.75em;}
  .order_sheet section.how_sheet ol.sheet_flow li span.li_num {
    font-family: "ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
    color: #4189C5;
    font-size: 18px;
    font-weight: bold;
  }
  .order_sheet section.how_sheet ol.sheet_flow li.if {
    font-size: 24px;
    font-weight: bold;
    padding: 0;
    margin: 0 0 1.5em;
  }
  .order_sheet section.how_sheet ol.sheet_flow li span.red {
    display: block;
    color: #C81E00;
    font-weight: bold;
    padding: 0 0 0 1em;
    text-indent: -1em;
  }
  .order_sheet section.how_sheet ol.sheet_flow li p.link {margin: 1.5em 0;}
  .order_sheet section.how_sheet ol.sheet_flow li br {line-height: initial;}
  .order_sheet section.how_sheet ol.sheet_flow li.other {
    color: #C81E00;
    font-size: 24px;
    font-weight: bold;
    line-height: 1.7;
    text-align: center;
    padding: 0;
    margin: 0 0 0.5rem;
  }
  .order_sheet section.how_sheet ol.sheet_flow li sup {
    font-size: 65.5%;
    vertical-align: top;
    position: relative;
    top: -0.3em;
  }
  
  .order_sheet section.order_gift {margin: 0 auto 100px;}
  .order_sheet section.order_gift ul {overflow:hidden;}
  .order_sheet section.order_gift ul li {
    width:31.25%;
    float:left;
    margin:0 3.125% 3.125% 0;
  }
  .order_sheet section.order_gift ul li:nth-child(3n) {margin:0 0 3.125%;}
  .order_sheet section.order_gift ul li img {display:block;}
  
  .order_sheet h2.h2_mark {color:#714987;}
  .order_sheet .center_lead {
    font-size:30px;
    font-weight:bold;
    text-align:center;
    margin:30px auto 80px;
  }
  .order_sheet section.order_product {margin: 0 auto 100px;}
  
  /*マナー相場紹介ページ*/
  
  main article > div.howto {
    background:url(./img/h1/bg_howto_sp.png) center center / cover;
    margin: 0 0 50px;
  }
  main article > div.howto h1 {
    height: 45%;
  }
  .howto .lead {
    line-height: 2;
    margin: 0 auto 30px;
    padding: 0;
  }
  .howto h2 {
    line-height: 1;
    text-align: center;
    color: #b17b3b;
    font-size: 20px;
    font-weight: 700;
    margin: 0 auto 20px;
  }
  .howto h2 > span {
    display: inline-block;
    border-top: 1px solid #b17b3b;
    border-bottom: 1px solid #b17b3b;
    padding: 10px 0;
  }
  .howto .manner {
    position: relative;
    clear: both;
    margin: 0 auto 20px;
  }
  .howto .manner:last-of-type {
    margin: 0 auto 50px;
  }
  .howto .manner::after {
    content: "";
    display: block;
    clear: both;
 }
  .howto .manner dt {
    position: relative;
    width: 180px;
    height: 180px;
    text-align: center;
    background: #8a779b;
    border-radius: 50%;
    margin: 0 auto 15px;
  }
  .howto .manner dt > span {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 100%;
    height: auto;
    font-size: 18px;
    color: #fff;
    font-weight: 700;
  }
  .howto .manner dd {
    float: right;
    box-sizing: border-box;
    width: 100%;
  }

  /* howto_season */
  .howto .h3_box .howto01 {
    background: url(./img/h3/bg_howto01_sp.png) center center / cover;
    margin: 0 0 40px;
  }

  .howto h4 {
    line-height: 1.2;
    text-align: center;
    color: #b17b3b;
    font-size: 20px;
    font-weight: 700;
    margin: 0 auto 15px;
  }
  .howto .howto_season h4 {
    margin: 0 auto 15px;
  }
  .howto .howto_season table {
    width: 100%;
    height: auto;
    table-layout: fixed;
    margin: 0 auto 30px;
  }
  .howto .howto_season table th,
  .howto .howto_season table td {
    text-align: center;
    line-height: 1.4;
    vertical-align: middle;
    color: #8a779b;
    font-weight: 700;
    border: 1px solid #8a779b;
    padding: 6px 5px;
  }
  .howto .howto_season table tr:first-of-type td:first-of-type {
    width: 50px;
  }
  .howto .howto_season table th {
    font-size: 12px;
  }
  .howto .howto_season table tr:not(:first-of-type) th {
    background: rgba(148,119,165,0.1);
  }
  .howto .howto_season table tr:first-of-type th {
    background: #8a779b;
    color: #fff;
  }
  .howto .howto_season table tr:first-of-type th:not(:first-of-type) {
    border-left: 1px solid #fff;
  }
  .howto .howto_season table tr:first-of-type th:not(:last-of-type) {
    border-right: 1px solid #fff;
  }
  .howto .howto_season table td {
    font-size: 14px;
  }
  .howto .howto_season .gift_link {
    overflow: hidden;
  }
  .howto .howto_season .gift_link li {
    position: relative;
    float: left;
    width: 47%;
    margin-bottom: 10%;
    min-height: 255px;
  }
  .howto .howto_season .gift_link li:nth-of-type(2n-1) {
    margin-right: 6%;
  }
  .howto .howto_season .gift_link li h5 {
    position: relative;
    box-sizing: border-box;
    text-align: center;
    font-size: 18px;
    font-weight: 700;
    color: #8a779b;
    margin: 0 auto 10px;
    padding: 40px 0 0;
  }
  .howto .howto_season .gift_link li h5::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    width: 30px;
    height: 30px;
    background: url(./img/sub/icon_greeting.svg) no-repeat center center / contain;
    margin: auto;
  }
  .howto .howto_season .gift_link li.greeting h5::before {
    width: 40px;
    height: 40px;
    background: url(./img/sub/icon_greeting.svg) no-repeat center center / contain;
  }
  .howto .howto_season .gift_link li.ochugen h5::before {background: url(./img/sub/icon_ochugen.svg) no-repeat center center / contain;}
  .howto .howto_season .gift_link li.oseibo h5::before {
    height: 40px;
    background: url(./img/sub/icon_oseibo.svg) no-repeat center center / contain;
  }
  .howto .howto_season .gift_link li.hikidemono h5::before {background: url(./img/sub/icon_hikidemono.svg) no-repeat center center / contain;}
  .howto .howto_season .gift_link li.kaiki h5::before {background: url(./img/sub/icon_kaiki.svg) no-repeat center center / contain;}
  .howto .howto_season .gift_link li.return h5::before {
    background: url(./img/sub/icon_return.svg) no-repeat center center / contain;
  }

  .howto .howto_season .gift_link li figure {
    width: 100%;
    margin: 0 auto 10px;
  }
  .howto .howto_season .gift_link li figure img {
    display: block;
    width: 100%;
    height: auto;
  }
  .howto .howto_season .gift_link li figure + p {
    font-size: 12px;
    line-height: 1.2;
    margin: 0 auto 25px;
  }
  .howto .howto_season .gift_link li .link_btn {
    position: absolute;
    bottom: 0;
    right:0;
    font-family:"ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
    text-align: right;
    font-weight: 700;
    color: #8a779b;
    text-decoration: underline;
  }
  .howto .howto_season p.common_link {
    max-width: 200px;
    height: 40px;
    margin: 0 auto 40px;
    line-height: 40px;
  }
  .howto .howto_season p.common_link a {
    font-size: 14px;
    font-weight: 700;
  }

  .howto .h3_box .howto02 {
    background: url(./img/h3/bg_howto02_sp.png) center center / cover;
    margin: 0 0 40px;
  }
  .howto .howto_price .lead {
    margin: 0 auto 20px;
  }
  .howto .howto_price table {
    width: 100%;
    margin: 0px auto 10px;
  }
  .howto .howto_price table th,
  .howto .howto_price table td {
    text-align: center;
    font-size: 14px;
    font-weight: 700;
    padding: 8px 5px;
    border:1px solid #8a779b;
  }
  .howto .howto_price table th {
    width: 42%;
    background: #8a779b;
    color: #fff;
  }
  .howto .howto_price table tr:not(:last-of-type) th {
    border-bottom: 1px solid #fff;
  }
  .howto .howto_price table td {
    color: #8a779b;
  }
  .howto .howto_price table + .caution {
    font-family:"ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
    font-size: 12px;
    text-align: right;
    margin: 0px auto 15px;
  }

  .howto .howto_price h5 {
    text-align: center;
    font-size: 18px;
    margin: 0 auto 10px;
  }
  .howto .howto_price .price_list {
    overflow: hidden;
    margin: 0 auto 40px;
  }
  .howto .howto_price .price_list li {
    float: left;
    width:48.5%;
    height: 30px;
    margin-bottom: 2%;
  }
  .howto .howto_price .price_list li:nth-of-type(2n-1) {
    margin-right: 3%;
  }
  .howto .howto_price .price_list li a {
    position: relative;
    box-sizing: border-box;
    display: block;
    width: 100%;
    text-align: center;
    font-size: 14px;
    font-weight: 500;
    line-height: 30px;
    background: #e8e4eb;
    padding: 0;
    border-radius: 10px;
  }
  .howto .howto_price .price_list li a::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 10px;
    transform: translateY(-50%);
    border-top: 4px solid transparent;
    border-bottom: 4px solid transparent;
    border-left: 10px solid #8a779b;
  }
  .howto .howto_price .border_box {
    box-sizing: border-box;
    width: 100%;
    height: auto;
    padding: 15px 4%;
    border: 1px solid #8a779b;
    margin: 0 auto 30px;
  }
  .howto .howto_price .border_box h5 {
    font-size: 16px;
    color: #8a779b;
    font-weight: 400;
  }
  .howto .howto_price .border_box h5 span {
    border-bottom: 1px solid #8a779b;
  }
  .howto .howto_price .gift_person dt {
    position: relative;
    z-index: 1;
    margin: 0 auto 8px;
  }
  .howto .howto_price .gift_person dt::before {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 1px;
    background: #8a779b;
    margin: auto;
  }
  .howto .howto_price .gift_person dt span {
    display: inline-block;
    position: relative;
    width: 200px;
    height: 24px;
    font-size: 14px;
    color: #fff;
    font-weight: 700;
    text-align: center;
    line-height: 24px;
    background:  #8a779b;
    border-radius: 5px;
    z-index:2;
  }
  .howto .howto_price .gift_person dd {
    margin: 0 auto 20px;
  }





  
  /** 阿波半田だより **/
  
  main article > div.blog {background:url(./img/h1/bg_blog.png) center center / cover;}
  main article > div.blog.title_area h1 ,
  main article > div.blog.title_area p {  
    box-sizing:border-box;
    position:absolute;
    width:100%;
    padding:0 4%;
    height:36%;
    margin:auto;
    top:0;
    bottom:0;
    right:0;
    left:0;
  }
  main article > div.blog.title_area h1 img,
  main article > div.blog.title_area p img {  
    width:auto;
    height:100%;
    max-width:none;
    max-height:none;
  }
  .blog_container {
    box-sizing:border-box;
    overflow:hidden;
  }
  .box.blog_container {max-width:100%;}
  .blog_date {
    display:inline-block;
    font-family:"ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
    font-size:13px;
    line-height:20px;
    margin:0 10px 0 0;
  }
  .blog_cat {
    display:inline-block;
    margin:0;
  }
  .blog_cat span {
    display:inline-block;
    width:auto;
    min-width:50px;
    height:20px;
    font-family:"ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
    font-size:11px;
    line-height:20px;
    margin:0 10px 0 0;
    padding:0 10px;
    text-align:center;
    color:#FFFFFF;
    background:#714985;
  }
  .blog_container h1.blog_title {
    font-size:18px;
    font-weight:bold;
    line-height:1.3;
    padding:5% 0;
    margin:3% auto 10%;
    border-top:solid 1px #714985;
    border-bottom:solid 1px #714985;
  }
  .blog_container .eyecatch {
    width:100%;
    margin:0 auto 8%;
  }
  .blog_container .editor_contents {overflow:hidden;}
  .blog_container .editor_contents p {
    font-size:1em;
    line-height:2;
    margin:0 0 1em;
  }
  .blog_container .editor_contents img.alignleft,
  .blog_container .editor_contents img.alignright {
    float:none;
    display: block;
    margin: 1em auto;
  }
  .blog_container .blog_cat_link {
    width:100%;
    font-family:"ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
    overflow:hidden;
    margin:0 auto 40px; 
  }
  .blog_container .blog_cat_link li {
    display:inline-block;
    width:auto;
    height:20px;
    margin:0 0 2%;
    line-height:20px;
    text-align:center;
    border-left:solid 1px #714985;
  }
  .blog_container .blog_cat_link li:last-child {border-right:solid 1px #714985;}
  .blog_container .blog_cat_link li a {
    font-size:11px;
    color:#714985;
    text-decoration:none;
    padding:0 20px;
  }
  .blog_container .blog_cat_link li a.current,
  .blog_container .blog_cat_link li a:hover {text-decoration:underline;}   
  .blog_container .blog_cat_title {
    width:100%;
    font-family:"ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
    font-size:27px;
    font-weight:bold;
    color:#714985;
    margin:0 auto 6%;
    text-align:center;
  }
  main article ul.blog_list {
    font-family:"ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
    width:100%;
    margin:0 auto 10%;
    overflow:hidden;
  }
  main article ul.blog_list li {
    width:48%;
    margin:0 2% 5% 0;
    float:left;
  }
  main article ul.blog_list li:nth-child(even) {margin:0 0 5%;}
  main article ul.blog_list li:nth-child(odd) {clear:both;}
  main article ul.blog_list li a {display:block;}
  main article ul.blog_list li a figure {
    position:relative;
    width:100%;
    height:0;
    margin:0;
    padding:80% 0 0;
    overflow:hidden;
    z-index:0;
  }
  main article ul.blog_list li a figure img {
    position:absolute;
    display:block;
    width:auto;
    max-width:none;
    height:100%;
    margin:auto;
    top:0;
    left:-100%;
    right:-100%;
    z-index:0;
  }
  main article ul.blog_list li a > div {
    padding:5%;
    background:#E8E2EB;
    font-size:12px;
  }
  main article ul.blog_list li a > div .blog_date {margin:0 5px 3% 0;}
  main article ul.blog_list li a > div .blog_cat {
    float:right;
    text-align:right;
    margin:0 0 3%;
  }
  main article ul.blog_list li a > div .blog_cat span {
    min-width:40px;
    margin-bottom:5px;
  }
  main article ul.blog_list li a > div .blog_title {
    width:100%;
    min-height:3em;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    overflow: hidden;
    margin:0;
    clear:both;
  }
  main article .blog_archive p.common_link {
    display:inline-block;
    width:auto;
    margin:0 10px 40px;
  }
  main article .blog_archive p.common_link a {width:180px;}
  section.blog_box {
    position:relative;
    margin:10% auto 15%;
  }
  /*
  section.blog_box .common_link a::before {
    display:inline-block;
    content:"";
    width:1.4em;
    height:1em;
    background:url(./img/sub/ico_all.png) no-repeat center / cover;
    vertical-align:middle;
    margin:0 10px 0 0;
  }*/
  section.blog_box .common_link {margin:0 auto;}
  section.blog_box .blog_list {margin:0 auto 5%;}
  /*section.blog_box .blog_list li:nth-child(3) {display:none;}*/
  main article section.blog_box p.common_link_t a {border:none;}
  main article ul.blog_list.related_list li {margin:0 0 5%;}
  main article ul.blog_list.related_list li:nth-child(3n) {margin:0 0 5%;}
  main article ul.blog_list.related_list li:nth-last-child(1) {margin:0 0 10%;}
  main article ul.blog_list.related_list li a {padding:4%;}
  main article ul.blog_list.related_list li a figure {width:30%;
    padding:24% 0 0;
  }
  main article ul.blog_list.related_list li a > div {
    width:70%;
    padding:0 0 0 5%;
  }

  main article ul.blog_list li a > div .blog_title {font-size:14px;}  
  
  .blog_single .editor_contents h2 {
    font-size:21px;
    margin:40px auto 20px;
  }
  .blog_single .editor_contents h3 {
    font-size:18px;
    margin:40px auto 20px;
  }
  .blog_single .editor_contents h4 {
    font-size:16px;
    margin:30px auto 15px;
  }
  .blog_single .editor_contents h5 {
    font-size:15px;
    margin:30px auto 15px;
  }
  .blog_single .editor_contents h6 {
    font-size:14px;
    margin:30px auto 15px;
  }
  .blog_single .editor_contents h2 span,
  .blog_single .editor_contents h3 span ,
  .blog_single .editor_contents h4 span ,
  .blog_single .editor_contents h5 span ,
  .blog_single .editor_contents h6 span {margin-top:-70px;padding-top:70px;} 
  .blog_single .editor_contents p {font-size:1em;}
.blog_single .editor_contents .common_link {line-height: 50px;}
  .blog_single .editor_contents figure {margin:0 auto 20px;}
  .blog_single .editor_contents figure figcaption {font-size:0.9em;}
  .blog_single .editor_contents table {
    font-size:1em;
    margin:0 0 1em;
  }
  .blog_single .editor_contents ul li {font-size:1em;}
  .blog_single .editor_contents ol li {font-size:1em;}
  .blog_single .editor_contents .bg_box {
    margin:20px auto;
    padding:1em;
  }
  .recommend_area {
    padding:30px 0;
    margin:30px 0 10px;
  }
  
  
  .recommend_box {
    padding:1em;
    margin:0 auto;
  }
  .recommend_box div {padding:0 0 0 1em;}
  .recommend_box div p {font-size:1em;}
  .recommend_box div p:nth-of-type(1) {font-size:1.2em;}
  .recommend_box div .common_link {margin:1em 0 0;}
  .h_solid {font-size:18px;}
  main article ul.blog_list.related_list li {margin:0 0 1em;}
  main article ul.blog_list.related_list li:nth-child(3n) {margin:0 0 1em;}
  main article ul.blog_list.related_list li a {padding:1em;}
  main article ul.blog_list.related_list li a > div {padding:0 0 0 1em;}
  main article ul.blog_list li a > div .blog_title {font-size:1em;}
  
  #toc_container {padding:1em!important;}
  #toc_container .toc_title {font-size:1em;}
  #toc_container ul {margin-left:0.5em!important;}
  #toc_container ul li {font-size:1em!important;}
  
.blog_cv {margin: 50px auto 20px;}
  
  /**TOPギフト追加202404**/
  
  .home_gift {
    width: 92%;
    padding: 0;
  }
  .home_gift .imglink_list {
    display: block;
    margin: 0 0 50px;
  }
  .home_gift .imglink_list > li {
    width: 100%;
    margin: 0 auto 10px;
  }
  .home_gift .imglink_list > li a .title {
    font-size: 20px;
  }  
  .home_gift .imglink_list > li a img {width: 100%;}
  
  
  /* 春キャンペーン2025 追記 */
  section.campaign div.free_mes{background: #e2515c;}
  section.campaign div.free_mes p > span{
    background: #fff;
    color: #e2515c;
  }
  section.campaign>p.lead{font-weight: 500;}

  /* 共通コンテンツ */
  section.campaign div.camp{
    margin-bottom: 100px;
    padding: 30px 15px 80px;
  }
  section.campaign div.camp .set_mes{
    font-size: 17px;
    font-weight: 700;
    line-height: 1.45;
    background: transparent;
    padding: 0.5em 0px 0.8em 73px;
  }
  section.campaign div.camp .set_mes::after{
    top: -5px;
    left: -5px;
    right: auto;
    bottom: auto;
    width: 73px;
    height: 90px;
  }
  section.campaign div.free_mes p{font-weight: 700;}
  section.campaign div.camp .set_mes+div>p{font-size: 15px;}
  section.campaign div.camp .camp_price{margin: 7% 0 0;}

  section.campaign div.camp p.common_link{
    bottom: 0;
    width: 50%;
    max-width: 240px;
    height: 60px;
    line-height: 60px;
  }
  section.campaign div.camp p.common_link a{
    font-family: "Zen Old Mincho", serif;
    font-size: 16px;
    font-weight: 700;
    letter-spacing: 0.1em;
    background: #e2515c;
  }
  

  /* 大満足セット */
  section.campaign div.camp:nth-of-type(2){
    background: -moz-linear-gradient(#ECF2DF 0%, #FFFFFF 100%);
    background: -webkit-gradient(linear, left top, left bottom, from(#ECF2DF), to(#FFFFFF));
    background: -webkit-linear-gradient(#ECF2DF 0%, #FFFFFF 100%);
    background: -o-linear-gradient(#ECF2DF 0%, #FFFFFF 100%);
    background: -ms-linear-gradient(#ECF2DF 0%, #FFFFFF 100%);
    background: linear-gradient(#ECF2DF 0%, #FFFFFF 100%);
  }
  section.campaign div.camp .set_mes.camp01{
    color: #83a727;
    border-bottom: 1px solid #83a727;
  }

  /* 食べ比べセット */
  section.campaign div.camp .set_mes.camp02{
    color: #e86e56;
    border-bottom: 1px solid #e86e56;
  }
  /* 2025/09 秋キャンペーン2025*/
  section.camp_autumn div.free_mes{background: #b51018;}
  section.camp_autumn div.free_mes p > span{
    background: transparent;
    display: flex;
    width: 5em;
  }
  section.camp_autumn div.free_mes p > span > span{
    padding: 0.1em;
    padding-left: 0.15em;
  }
  section.campaign div.camp .set_mes{
    padding-bottom: 0;
    border-bottom: none;
  }
  section.camp_autumn div.camp .set_mes::before{inset: auto 0 0 auto;}
  section.camp_autumn div.camp .set_mes::after{inset: -88% auto -100% 0px;}
  section.camp_autumn div.camp .set_mes span{padding-left: 0.8em;}
  section.camp_autumn div.camp .set_mes span::before{
    inset: -100% calc(-100% + 92px) -100% -100%;
    width: calc(100% + 81px);
  }
  section.camp_autumn div.camp p.common_link a{background: #52680b;}
  
  
  
  
  /**ショップご利用に関するアンケート**/

  .survey_box {padding: 20px 4% 0;}
  .survey_box h2 {
    width: 80%;
    margin: 0 auto 20px;
  }
  .survey_box .flex {display: block;}
  .survey_box .flex > div {
    width: 100%;
    margin: 0 auto 20px;
  }
  .survey_box .flex > div h3 {
    font-size: 18px;
    margin: 0 0 15px;
  }
  .survey_box .flex > div p {font-size: 14px;}
  .survey_box .flex > figure {width: 100%;}
  .survey_box iframe {
    height: 3950px;
  }
  .survey_box iframe + p {font-size: 14px;}

  
  
  
}