﻿@charset "utf-8";

/* ======================================================================= 
   Wordpress Native CSS 
======================================================================= */
/* editor */
 
strong { font-weight: bold; }
em { font-style: italic; }
blockquote {
    display: block;
    -webkit-margin-before: 1em;
    -webkit-margin-after: 1em;
    -webkit-margin-start: 40px;
    -webkit-margin-end: 40px;
}

/* img */
 
.aligncenter {
    display: block;
    margin: 1em auto;
}
.alignright { float: right;margin-left:1em; }
.alignleft { float: left;margin-right:1em; }
 
img[class*="wp-image-"],
img[class*="attachment-"] {
    height: auto;
    max-width: 100%;
}

.editor_contents figure,
.editor_contents ul,
.editor_contents ol,
.editor_contents dl,
.editor_contents table,
.editor_contents img,
.editor_contents div,
.editor_contents p {
    max-width:100%;
    height:auto;
 }

.editor_contents iframe {
    max-width:100%;
 }

span.wpcf7-not-valid-tip {font-size:0.8em!important;display:inline!important;}
hr.anc {border:none;height: 0;margin-top: -200px;padding-top: 200px;}
hr#anc01  {margin-top:-200px!important;padding-top:200px!important;}
#anc01 {margin-top:-70px!important;padding-top:70px!important;}

/* -----------------------------------------------------------
　共通要素・可変画像（親要素幅まで）
----------------------------------------------------------- */

img {
  max-width:100%;
  height: auto;
}

.fcRed {
  color:#a40000;
}

.fwBold {
  font-weight:bold;
}

.left {
  float: left;
}

.right {
  float: right;
}

.align_right {text-align:right;}

.center {
  text-align: center;
}

.clear {
  clear: both;
}

.italic {font-style:italic;}

a {
  color:inherit;
  text-decoration:none;
}
p.right a:hover {text-decoration:underline!important;}

body {
  font-family: "ヒラギノ明朝 ProN W6", "HiraMinProN-W6","游明朝",YuMincho,"Yu Mincho","HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-size:14px;
  color:#000;
  line-height:1.7em;
} 

.gothic {
  font-family: "ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}

#loginLogout {height:100%;}
#logoutButton ,#loginButton{ display: none; }

@media screen and (min-width: 769px),print{ 

  .sp_cont {
    display:none;
  } 
  
  figure {
    width:100%;
    margin:0 auto 1em;
    text-align:center;
  }
  
  figcaption {
    font-size:1em;
    margin:0;
  }
  
  img.origin {width:auto;max-width:none;}
  figure.origin img {width:auto;max-width:none;} 
  .hover_btn {transition:0.5s;opacity:1;}
  .hover_btn:hover {transition:0.5s;opacity:0.7;}
	
  #telfaxflow,
  #returned,
  #mscard {padding-top:200px;margin-top:-200px;}

}

/* -----------------------------------------------------------
  テンプレート
----------------------------------------------------------- */
 
@media screen and (min-width: 769px),print{ 
  
  /* :::::::::: header :::::::::: */
	
  header {
    position:fixed;
    width:100%;
    height:90px;
    overflow:hidden;
    margin:0 auto;
    clear:both;
    background:#FFF;
    z-index:99;
    top:0;
    left:0;
  }
  
  header .header_box {
    position:relative;
    box-sizing:border-box;
    width:100%;
    max-width:1240px;
    height:90px;
    overflow:hidden;
    margin:0 auto;
    padding:10px 20px;
  }

  header .header_box .logo {
    width:229px;
    height:66px;
    float:left;
    background:url(./img/common/logo_pc.png) no-repeat left center / auto 100%;  
  }
  header .header_box .logo a {
    display:block;
    width:100%;
    height:100%;
  }
  header .header_box .logo img {display:none;}
  
  header .header_box .cart {
    position:absolute;
    width:80px;
    font-size:10px;
    height:30px;
    line-height:30px;
    text-align:center;
    top:33px;
    right:190px;
    z-index:100;
  }
  
  header .header_box .cart a {
    box-sizing:border-box;
    display:block;
    width:100%;
    height:100%;
    border-radius:15px;
    background:#9678a5;
    color:#FFF;
    padding:0 5px;
  }
  
  header .header_box .cart a:hover {background:#714987;}
  
  header .top_nav {
    position:relative;
    box-sizing:border-box;
    width:570px;
    height:66px;
    padding:0;
    float:right;
  }
  /*
  header.s_fixed .top_nav {top:-100px;}
  .home header.s_fixed .top_nav {top:12px;}
  */
  
  header ul.top_nav01  { 
    position:absolute;
    width:auto;
    height:20px;
    top:0;
    right:190px;
    z-index:100;
    border-left:solid 1px #c8c8c8;
  }
  header ul.top_nav02  { 
    position:absolute;
    width:auto;
    height:20px;
    top:33px;
    right:275px;
    z-index:100;
  }
  header ul.top_nav01 li {
    width:auto;
    float:left;
    font-size:10px;
    height:20px;
    line-height:20px;
    padding:0 10px;
    border-right:solid 1px #c8c8c8;
  }
  
  header ul.top_nav01 li a:hover {text-decoration:underline;}
  
  header ul.top_nav02 li.tn_fb {
	  width:30px;
	  height:30px;
	  padding:0 0 0;
    margin:0 10px 0 0;
    transition:0.5s;
    opacity:1;
    float:left;
    /*text-indent:-9999px;*/
  }
	
  header ul.top_nav02 li.tn_fb a {	
  	display:block; 
  	width:100%;
  	height:100%; 
    /*background:url(./img/common/header_fb_pc.png) no-repeat center /cover;*/
  }
  
  header ul.top_nav02 li.tn_fb:hover {	
    transition:0.5s;
    opacity:0.6;
  }
	
  header ul.top_nav02 li.login {
    width:70px;
    margin:0 5px 0 0;
    float:left;
    font-size:10px;
    height:30px;
    line-height:30px;
    text-align:center;
    border-radius:15px;
    background:#c7c7c7;
  }
  
  header ul.top_nav02 li.login:hover {background:#a40000;color:#FFF;}
  
  header ul.top_nav02 li.login a { 
  	display:block; 
  	width:100%;
  	height:100%; 
    box-sizing:border-box;
    border-radius:15px;
    padding:0 5px;
  }
  
  header ul.top_nav02 li.login a:hover {text-decoration:none;} 
  header ul.top_nav02 li.login a:hover {background:#a40000;color:#FFF;}
  
  header ul.top_nav02 li.tn_houjin {
    width:100px;
    float:left;
    margin:0 5px 0 0;
    font-size:10px;
    height:30px;
    line-height:30px;
    text-align:center;
  }
  
  header ul.top_nav02 li.tn_houjin a {
    box-sizing:border-box;
    display:block;
    width:100%;
    height:100%;
    border-radius:15px;
    background:#eae4ed;
    color:#000;
    padding:0 5px;
  }
  header ul.top_nav02 li.tn_houjin a:hover {background:#a40000;color:#FFF;}
  header ul.top_nav02 li.mypage {
    width:70px;
    float:left;
    margin:0;
    font-size:10px;
    height:30px;
    line-height:30px;
    text-align:center;
  }
  
  header ul.top_nav02 li.mypage a {
    box-sizing:border-box;
    display:block;
    width:100%;
    height:100%;
    border-radius:15px;
    background:#9678a5;
    color:#FFF;
    padding:0 5px;
  }
  
  header ul.top_nav02 li.mypage:hover a {background:#a40000;color:#FFF;text-decoration:none;}
  
  header p.hosho {
    position: absolute;
    width: 181px;
    height: 66px;
    top: 0;
    right:0;
    z-index: 100;
  }
  
  
  
  /* :::::::::: nav :::::::::: */
  
  nav {
    position:fixed;
    box-sizing:border-box;
    width:100%;
    height:80px;
    z-index:99;
    background:#FFF;
    top:90px;
   
  }
  .home nav {position:static;}
  nav.s_fixed {position:fixed;top:0;}
  .home nav.s_fixed {position:static;}
  .home nav.fixed {
    position:fixed;
    top:90px;
    left:0;
    z-index:99;
  }

  .customize-support nav.fixed {top:82px;}
  
  nav .menu {display:none;}
  
  nav div.tel_nav {
    width:100%;
    height:40px;
    background:#9477a7;
  }
  
  nav div.tel_nav p {
    box-sizing:border-box;
    width:100%;
    max-width:1040px;
    margin:0 auto;
    padding:0 20px;
  }
  
  nav div.tel_nav p span {
    position:relative;
    display:block;
    height:40px;
    vertical-align:middle;
    float:left;
  }
  
  nav div.tel_nav p span:nth-of-type(1) {width:53.75%;margin:0 3.3% 0 0;}
  nav div.tel_nav p span:nth-of-type(2) {width:42.95%;}  
  
  nav div.tel_nav p span img {
    position:absolute;
    width:100%;
    margin:auto;
    top:0;
    bottom:0;
    left:0;
    right:0;
  }
  
  nav div.tel_nav p span:nth-of-type(1) img {max-width:537px;}
  nav div.tel_nav p span:nth-of-type(2) img {max-width:429px;}  
  
  nav ul.bottom_nav {
    box-sizing:border-box;
    width:100%;
    max-width:1040px;
    height:auto;
    overflow:hidden;
    padding:0 20px;
    margin:0 auto;
  }
  
  nav ul.bottom_nav > li {
    box-sizing:border-box;
    height:auto;
    padding:0;
    margin:0;
    float:left;
  }
  
  nav ul.bottom_nav > li:nth-child(1) {width:18.6%;}
  nav ul.bottom_nav > li:nth-child(2) {width:13.8%;}
  nav ul.bottom_nav > li:nth-child(3) {width:13.8%;}
  nav ul.bottom_nav > li:nth-child(4) {width:16.1%;}
  nav ul.bottom_nav > li:nth-child(5) {width:22.9%;}
  nav ul.bottom_nav > li:nth-child(6) {width:14.8%;}
  
  nav ul.bottom_nav > li:nth-child(1) span img {max-width:122px;}
  nav ul.bottom_nav > li:nth-child(2) span img {max-width:58px;}
  nav ul.bottom_nav > li:nth-child(3) span img {max-width:58px;}
  nav ul.bottom_nav > li:nth-child(4) span img {max-width:76px;}
  nav ul.bottom_nav > li:nth-child(5) span img {max-width:130px;}
  nav ul.bottom_nav > li:nth-child(6) span img {max-width:92px;}
  
  nav ul.bottom_nav > li > span {
    box-sizing:border-box;
    position:relative;
    z-index:0;
    display:block;
    width:100%;
    height:40px;
    cursor:pointer;
    padding:10px 5px;
    text-align:center;
  }
  
  nav ul.bottom_nav > li:nth-child(1) > span {padding-left:0;}
  nav ul.bottom_nav > li:nth-child(6) > span {padding-right:0;}
  
  nav ul.bottom_nav > li > span::before {
    position:absolute;
    display:block;
    content:"";
    width:1px;
    height:20px;
    background:#000;
    z-index:0;
    margin:auto;
    top:0;
    bottom:0;
    left:0;
  }
  
  nav ul.bottom_nav > li:nth-child(1) > span::before {content:none;}
  
  nav ul.bottom_nav > li.active > span::after {
    position:absolute;
    display:block;
    content:"";
    width:0;
    height:0;
    border-bottom:solid 0.75em #c4b4ce;
    border-left:solid 0.5em transparent;
    border-right:solid 0.5em transparent;
    margin:auto;
    bottom:0;
    left:0;
    right:0;
  }
  
  nav ul.bottom_nav li div.subnav {
    display:none;
    width:auto;
    position:absolute;
    left:0;
    right:0;
    background:#c4b4ce;
    padding:20px 0;
    z-index:10;
  }
  
  nav ul.bottom_nav li div.subnav .box {
    box-sizing:border-box;
    width:auto;
    max-width:1040px;
    padding:0 20px;
    height:auto;
    margin:0 auto;
  }
  
  nav ul.bottom_nav li div.subnav .box ul {
    position:relative;
    z-index:0;
    margin:0.5em 0 0;
  }
  
  nav ul.bottom_nav li:nth-of-type(2) div.subnav .box ul ,
  nav ul.bottom_nav li:nth-of-type(4) div.subnav .box ul {
    float:left;
    
  }  
  
  nav ul.bottom_nav li div.subnav .box ul li {
    float:left;
    font-size:13px;
    line-height:1.8em;
  }
  
  nav ul.bottom_nav li div.subnav .box ul li span {
    position:relative;
    display:block;
    padding:0 0 0 1em;
  }  
  
  nav ul.bottom_nav li div.subnav .box ul li span:hover {text-decoration:underline;}
  
  nav ul.bottom_nav li div.subnav .box ul li span::before {
    position:absolute;
    display:block;
    content:">";
    top:0;
    left:0;
  }
  
  nav ul.bottom_nav li:nth-child(1) div.subnav .box div {
    width:32%;
    float:left;
    margin:0 2% 0 0;
  }
  
  nav ul.bottom_nav li:nth-child(1) div.subnav .box div:nth-of-type(3) {margin:0;}
  
  nav ul.bottom_nav li:nth-child(1) div.subnav .box div li {float:none;}
  
  nav ul.bottom_nav li:nth-of-type(2) div.subnav .box ul li ,
  nav ul.bottom_nav li:nth-of-type(4) div.subnav .box ul li {
    float:none;
  } 
  
  nav ul.bottom_nav li:nth-of-type(2) div.subnav .box p {
    width:30%;
    margin:0 4% 0 0;
    float:left;
  }
  
  nav ul.bottom_nav li:nth-of-type(2) div.subnav .box p.right {
    margin:1.5em;
    float:right;
    width:21.45%;
  }
  nav ul.bottom_nav li:nth-of-type(2) div.subnav .box p.right::before {content:"> ";}
  nav ul.bottom_nav li:nth-of-type(2) div.subnav .box p.right a:hover {text-decoration:underline;}
  
  
  nav ul.bottom_nav li:nth-of-type(2) div.subnav .box ul {width:20%;margin:1em 0 0;}
  nav ul.bottom_nav li:nth-of-type(2) div.subnav .box ul:nth-of-type(2) {width:22%;}
  nav ul.bottom_nav li:nth-of-type(2) div.subnav .box ul:nth-of-type(3) {width:18%;}
  
  nav ul.bottom_nav li:nth-of-type(3) div.subnav .box ul li {width:32%;margin:0 2% 2% 0;}
  nav ul.bottom_nav li:nth-of-type(3) div.subnav .box ul li:nth-child(3n) {margin:0;}
  nav ul.bottom_nav li:nth-of-type(3) div.subnav .box ul li:nth-child(4) {clear:both;}
  nav ul.bottom_nav li:nth-of-type(3) div.subnav .box ul li:nth-child(4) ,
  nav ul.bottom_nav li:nth-of-type(3) div.subnav .box ul li:nth-child(5) {margin:0 2% 0 0;}

  nav ul.bottom_nav li:nth-of-type(4) div.subnav .box p {
    width:23%;
    margin:0 2% 0 0;
    float:left;
  }
  
  nav ul.bottom_nav li:nth-of-type(4) div.subnav .box ul {width:29%;margin:1em 0 0;}
  nav ul.bottom_nav li:nth-of-type(4) div.subnav .box ul:nth-of-type(2) {width:21%;margin:1em 0 0;}
  
  nav ul.bottom_nav li:nth-of-type(5) div.subnav .box ul li {width:23.5%;margin:0 2% 0 0;}
  nav ul.bottom_nav li:nth-of-type(5) div.subnav .box ul li:last-child {margin:0;}  
  
  nav ul.bottom_nav li:nth-of-type(6) div.subnav .box ul li {width:32%;margin:0 2% 2% 0;}
  nav ul.bottom_nav li:nth-of-type(6) div.subnav .box ul li:nth-child(3n) {margin:0;}
  nav ul.bottom_nav li:nth-of-type(6) div.subnav .box ul li:nth-child(4) ,
  nav ul.bottom_nav li:nth-of-type(6) div.subnav .box ul li:nth-child(5) {margin:0 2% 0 0;}
  
  nav ul.bottom_nav_sp {display:none;}
}

@media screen and (min-width: 860px) and (max-width: 900px),print{ 
  header .header_box .logo {
    width:25%;
    background: url(./img/common/logo_pc.png) no-repeat left center / 100%;
  }
}
@media screen and (min-width: 769px) and (max-width: 859px),print{ 
  header .header_box .logo {
    width:18%;
    background: url(./img/common/logo_pc.png) no-repeat left center / 100%;
  }
}
@media screen and (min-width: 769px),print{ 
  /* :::::::::: breadcrumbs :::::::::: */
  
  .breadcrumbs {
    box-sizing:border-box;
    max-width:1040px;
    width:100%;
    height:auto;
    margin:0 auto 10px;
    padding:0 20px;
    /*font-size:11px;*/
    line-height:13px;
    color:#000;
    font-family: "ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
    font-size:13px;
  }
  
  .breadcrumbs span {
    display:inline-block;
    margin:0 0.5em;
  }
  
  .breadcrumbs span a {
    color:#000;
  }
  
  .breadcrumbs span:first-child {margin-left:0;}
  
  /* :::::::::: main :::::::::: */
  
  main {
    display:block;
    width:100%;
    height:auto;
    padding:0 0 0;
  }
  
  main.s_fixed {padding:80px 0 0;}
  
  .home main {
    padding:0;
  }
  
  .home main.fixed {
    padding:80px 0 0;
    z-index:0;
  }
  
  main article {
    width:100%;
    height:auto;
    overflow:hidden;
    margin:0 auto;
    padding:180px 0 0;
  }
  
  .home main article {padding:40px 0 0;}
  
  main article p {
    margin:0 0 1em;
    line-height:1.7em;
  }
  
  main article .box {
    box-sizing:border-box;
    width:100%;
    max-width:1040px;
    height:auto;
    overflow:hidden;
    margin:0 auto;
    padding:0 20px;
    clear:both;
  }
  
  main article .t_box {
    box-sizing:border-box;
    width:100%;
    max-width:840px;
    height:auto;
    overflow:hidden;
    margin:0 auto;
    padding:0 20px;
    clear:both;
  }
  
  main article .m_box {
    box-sizing:border-box;
    width:100%;
    max-width:740px;
    height:auto;
    overflow:hidden;
    margin:0 auto;
    padding:0 20px;
    clear:both;
  }
  
  main article .i_box {
    box-sizing:border-box;
    width:100%;
    max-width:740px;
    height:auto;
    overflow:hidden;
    margin:0 auto;
    padding:0 20px;
    clear:both;
  }	
  
  main article .c_box {
    box-sizing:border-box;
    width:100%;
    height:auto;
    overflow:hidden;
    margin:0 auto 30px;
    padding:30px;
    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:16px;
    margin:0 0 5px;
    clear:both;
  }
  
  main article p.lead {
    box-sizing:border-box;
    width:100%;
    max-width:740px;
    height:auto;
    overflow:hidden;
    margin:0 auto 60px;
    padding:0 20px;
    clear:both;
    line-height:1.9em;
  }	
  
  main article p.sub_lead {
    margin:0 auto 30px;
    line-height:1.9em;
  }	
  
  main article p.bg_mark {background:url(./img/common/bg_mark.png) no-repeat center center / auto 90% ;padding:30px 20px;}
  main article .quality p.bg_mark {padding:50px 20px;}
  /*main article p.bg_text {background:url(./img/common/bg_text.png) no-repeat center center / 80% auto;padding:30px 20px;}
  main article p.bg_logo {background:url(./img/common/bg_logo.png) no-repeat center center / auto 90%;padding:30px 20px;}*/
  
  
  main article ul.about_banner {
    box-sizing:border-box;
    width:100%;
    height:auto;
    overflow:hidden;
    max-width:1040px;
    padding:0 20px;
    margin:100px auto;
  }
  
  main article ul.about_banner li {
    width:48%;
    height:auto;
    float:left;
    margin:0 4% 4% 0;
	  transition:0.5s;
	  opacity:1;
  }
  
  main article ul.about_banner li:nth-child(even) {margin:0 0 4%;}
	
  main article ul.about_banner li:hover {
	  transition:0.5s;
	  opacity:0.6;
  }
  
  main article ul.product_banner {
    box-sizing:border-box;
    width:100%;
    height:auto;
    overflow:hidden;
    max-width:1040px;
    padding:0 20px;
    margin:0 auto 60px;
  }
  
  main article ul.product_banner li {
    width:33.2%;
    height:auto;
    float:left;
    margin:0;
    padding:0;
	  transition:0.5s;
	  opacity:1;
  }
  
  main article ul.product_banner li img {display:block;}
  
  main article ul.product_banner li:hover {
	  transition:0.5s;
	  opacity:0.6;
  }
  
  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:90px auto 0;
  }

  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%;
    margin:0;
    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 50px;
  }
  
  div.title_area {
    box-sizing:border-box;
    position:relative;
    width:100%;
    margin:0 0 80px;
    padding:28% 0 0;
    background:#ccc;
  }
  
  main article p.common_link {
    width:100%;
    max-width:200px;
    height:40px;
    margin:50px auto 0;
    text-align:center;
    line-height:40px;
  }
  
  main article p.common_link a {
    box-sizing:border-box;
    display:block;
    width:100%;
    height:100%;
    background:#eae4ee;
  }
  
  main article p.common_link a:hover {background:#c5b4ce;}
  
  main article p.common_link_t a {
    background:none;
    border:solid 1px #000;
  }
  
  main article p.common_link_t a:hover {border:none;}
  
  main article p.store_link {
    width:100%;
    box-sizing:border-box;
    max-width:740px;
    padding:0 20px;
    height:50px;
    margin:0 auto 100px;
  }
  
  main article p.store_link a {
    display:block;
    width:100%;
    height:100%;
    text-align:center;
    color:#FFF;
    background:#714988;
    opacity:1;
    transition:0.5s;
    line-height:50px;
  }
  
  main article p.store_link a:hover {
    opacity:0.6;
    transition:0.5s;
  }
  
  main article p.store_link a span {
    position:relative;
    padding:0 0 0 40px;
  }
  
  main article p.store_link a span::before {
    position:absolute;
    display:block;
    content:"";
    width:30px;
    height:31px;
    margin:auto;
    background:url(./img/common/bg_store.png) no-repeat center / cover;
    top:0;
    bottom:0;
    left:-1em;
  }
  
  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:100%;
    max-width:1040px;
    margin:0 auto 50px;
    height:auto;
    padding:20px 20px 0;
  }
  
  section.common_contact > div {
    width:100%;
    height:auto;
    margin:0;
    box-sizing:border-box;
    border:solid 1px #000;
    z-index:0;
    padding:30px;
    overflow:hidden;
  }
    
  section.common_contact div h3 {
    position:absolute;
    display:block;
    width:540px;
    height:40px;
    background:#FFF;
    text-align:center;
    margin:auto;
    top:0;
    left:0;
    right:0;
    z-index:1;
  }
  
  section.common_contact div figure {width:35%;float:left;margin:0;}
  section.common_contact div div {width:60%;float:right;}
  section.common_contact div div p.common_link {width:48%;margin:0 0 1em;float:left;}
  section.common_contact div div p.mail_contact {width:48%;height:50px;float:left;margin:0 0 0 4%;position:relative;}
  /*section.common_contact div div p.mail_contact img{position:absolute;margin:auto;top:0;bottom:0;}*/
  section.common_contact div div p.mail_contact + p {clear:both;margin:0;}
  
  .common_catalog {
    width:100%;
    max-width:1040px;
    box-sizing:border-box;
    margin:0 auto 100px;
    padding:0 20px;
    opacity:1;
    transition:0.5s;
  }
  
  .common_catalog:hover {
    opacity:0.6;
    transition:0.5s;
  }
  
  a.mailto {color:#714988;}
  
  /* :::::::::: 下部共通コンテンツ :::::::::: */
  
  main article .bottom_content {
    margin:80px auto 40px;
    font-family: "ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  }
  
  main article .bottom_content div {
    position:relative;
    box-sizing:border-box;
    padding:0 1%;
    border:solid 1px #714987;
    overflow:hidden;
    float:left;
    width:49%;
    margin:0 2% 2% 0;
  }　
  
  main article .bottom_content div:nth-of-type(1) {}
  main article .bottom_content div:nth-of-type(2) {width:49%;margin:0 0 2%;}
  main article .bottom_content div:nth-of-type(3) {width:100%;margin:0 0 2%;text-align:center;}
  main article .bottom_content div:nth-of-type(4) {width:23.5%;margin:0 2% 2% 0;}
  main article .bottom_content div:nth-of-type(5) {width:23.5%;margin:0 2% 2% 0;}
  main article .bottom_content div:nth-of-type(6) {width:23.5%;margin:0 2% 2% 0;}
  main article .bottom_content div:nth-of-type(7) {width:23.5%;margin:0 0 2%;}
  
  main article .bottom_content div h3 {
    width:100%;
    text-align:center;
    font-size:24px;
    color:#714987;
    margin:15px 0 0.8em;
  }
  
  main article div p.detail_link {
    width:150px;
    height:30px;
    text-align:center;
    line-height:30px;
    background:#eae4ed;
    margin:0 auto;
  }
  
  main article .bottom_content div p.detail_link {
    position:absolute;
    width:120px;
    margin:auto;
    left:0;
    right:0;
    bottom:30px;
  }
  
  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;
	margin:0 0 1em!important;
  }
  
  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 90px;}
  ul.guide li {
    position:relative;
    line-height:1.7em;
    padding:0 0 0 1.5em;
    font-size:14px;
  }
  
  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 30px;}
  ul.cr_card li {display:inline;margin:0;}
  main article .bottom_content ul.cr_card {margin:0 auto 80px;}
  
  ul.cr_card li img {width:auto;max-width:none;}
  main article .bottom_content div:nth-of-type(3) p:nth-of-type(1) {margin:0 auto;font-size:14px;}
  main article .bottom_content div:nth-of-type(3) p:nth-of-type(2) {font-size:13px;margin:0 auto 2em;}
  main article .bottom_content div:nth-of-type(4) p:nth-of-type(1) {margin:0 auto;font-size:14px;}
  main article .bottom_content div:nth-of-type(4) p:nth-of-type(3) {margin:0 auto;font-size:14px;}
  main article .bottom_content div:nth-of-type(5) p:nth-of-type(1) {margin:0 auto 1em;font-size:14px;}
  main article .bottom_content div:nth-of-type(6) p:nth-of-type(1) {margin:0 auto;font-size:14px;}
  main article .bottom_content div:nth-of-type(7) p:nth-of-type(1) {margin:0 auto 1em;font-size:14px;}
  
  main article .bottom_content div p span {
    position:relative;
    display:block;
    line-height:1.5em;
    padding:0 0 0 1.2em;
    font-size:14px;
  }
  
  main article .bottom_content div:nth-of-type(4) p:nth-of-type(1) img {display:block;width:50%;margin:0 auto 0.5em;}
  main article .bottom_content div:nth-of-type(4) p:nth-of-type(3) img {display:block;width:50%;margin:0 auto 0.5em;}
  main article .bottom_content div:nth-of-type(5) p:nth-of-type(2) img {display:block;width:70%;margin:0 auto 0.5em;}
  main article .bottom_content div:nth-of-type(5) p span:last-child {margin:0 auto 40%;}
  main article .bottom_content div p span:before {
    position:absolute;
    display:block;
    content:"※";
    width:1em;
    height:1em;
    top:0;
    left:0;
  }
  
  /* :::::::::: aside :::::::::: */

  aside {
    box-sizing:border-box;
    width:100%;
    height:auto;
    overflow:hidden;
    max-width:1040px;
    margin:0 auto 30px;
    padding:0 20px;
    font-family: "ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  }
  
  aside div {
    box-sizing:border-box;
    width:15%;
    height:auto;
    float:left;
    margin:0 5% 0 0;
    padding:3% 2.5% 3% 2.5%;
    border-right:solid 1px #000;
  }
  
  aside div h2 {
    width:96%;
    margin:0 auto 5px;
  }
  
  aside > ul {
    width:20%;
    float:left;
    font-size:13px;
    padding:1% 0 0;
    margin:2.5em 0 0;
  }
  
  aside > ul:nth-of-type(1) {margin:0;}
  
  aside > ul > li {
    position:relative;
    padding:0 0 0 1.2em;
    margin:0 0 1.5em;
    line-height:1.1em;
  }
  
  aside > ul:nth-of-type(1) > li:nth-of-type(1) > ul > li{padding:0;}
  
  aside > ul > li::before {
    position:absolute;
    display:block;
    content:">";
    left:0;
  }
  
  aside > ul:nth-of-type(1) li:nth-of-type(1) ul li::before {content:none;}
  
  aside > ul > li > span {
    display:block;
    margin:0 0 0.5em;
  }
  
  aside > ul > li > ul > li {margin:0 0 0.5em;}
  
  aside ul li a:hover {text-decoration:underline;}
 
  
  /* :::::::::: footer :::::::::: */
  
  footer {
    width:100%;
    height:auto;
    background:url(./img/common/bg_footer.png) no-repeat center center,#9477a7;
    color:#FFF;
    text-align:center;
    padding:70px 0;
  }
  
  footer p.pagetop {
    position:fixed;
    z-index:30;
    bottom:200px;
    right:0;
    width:45px;
    height:150px;
  }
  
  footer .f_logo {
    width:80%;
    margin:5px auto;
    max-width:530px;
  }
  
  footer .address {font-size:14px;}
  footer .copyright {font-size:11px;}
}

@media screen and (min-width: 1240px),print{ 
  div.wide_area {
    height:300px;
    padding:0;
  }
  
  .h3_box div.wide_area {
    height:300px;
    padding:0;
  }
     
  div.title_area {
    height:300px;
    margin:0 0 60px;
    padding:0 0 0;
    background:#ccc;
  }
}

/* -----------------------------------------------------------
 hx
----------------------------------------------------------- */

@media screen and (min-width: 769px),print{ 
  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) top 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;}
  
  div.title_area h1 {  
    box-sizing:border-box;
    position:absolute;
    width:100%;
    max-width:1040px;
    padding:0 20px;
    height:18%;
    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:27px;
    color:#714987;
    text-align:left;
    margin:0 0 20px;
    padding:0 0 5px;
    line-height:1.4em;
    border-bottom:solid 1px #714988;
  }  
	
  main article .single_box {
    height:auto;
	min-height:400px;
	margin:0 auto 50px;
  } 
  
  main article h2.h2_common {
    font-size:32px;
    color:#714987;
    text-align:center;
    margin:0 0 20px;
    line-height:1.4em;
  }  
  
  main article h2.h2_border {
    font-size:27px;
    color:#714987;
    text-align:left;
    margin:0 0 20px;
    padding:0 0 5px;
    line-height:1.4em;
    border-bottom:solid 1px #714988;
  }  
  
  main article h2.h2_mark {
    box-sizing:border-box;
    width:100%;
    font-size:32px;
    background:url(./img/h2/h2_mark.png) no-repeat top left/ auto 100%;
    margin:0 0 20px;
    padding:0.3em 0 0.3em 0.75em;
  }
  
  main article h2.h2_side {
    width:100%;
    height:auto;
    text-align:center;
    margin:0 auto 35px;
    font-size:32px;
    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.5em 190px;
     background:url(./img/h2/h2_side_l.png) no-repeat left center,url(./img/h2/h2_side_r.png) no-repeat right center;
  }
  
  main article h2.h2_img {
    box-sizing:border-box;
    width:100%;
    height:auto;
    max-width:600px;
    padding:20px;
    text-align:center;
    margin:0 auto;
  }
  
  main article h2.h2_img img {
    width:50%;
    max-width:100%;
  }
  
  main article section.point h2 {
    position:relative;
    box-sizing:border-box;
    width:100%;
    height:auto;
    font-size:20px;
    padding:10px 0 5px 210px;
    margin:0 auto 10px;
    background:url(./img/h2/bg_point.png) no-repeat top left;
  }
  
  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:20px;
    padding:10px 0 5px 250px;
    margin:0 auto 10px;
    background:url(./img/h2/bg_check.png) no-repeat top left;
  }
  
  .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:100%;
    max-width:1040px;
    padding:0 20px;
    height:11.6%;
    margin:auto;
    top:0;
    bottom:0;
    right:0;
    left:0;
    text-align:center;
  }
  
  section.about div.wide_area h3.h3_img {height:37.9%;}
  section.about .about01 h3.h3_img {background:url(./img/h3/h3_about01.png) no-repeat center / auto 100%;}
  section.about .about02 h3.h3_img {background:url(./img/h3/h3_about02.png) no-repeat center / auto 100%;}
  section.about .about03 h3.h3_img {background:url(./img/h3/h3_about03.png) no-repeat center / auto 100%;}
  section.about .about04 h3.h3_img {background:url(./img/h3/h3_about04.png) no-repeat center / auto 100%;}
  
  div.wide_area h3.h3_img img {
    width:auto;
    height:100%;
    max-width:none;
    max-height:none;
  }
  
  .h4_box h4.h4_img {max-width:100%;margin:0 auto 50px;text-align:center;}
  .h4_box h4.h4_img img {width:auto;max-width:none;}
}

/* -----------------------------------------------------------
 home
----------------------------------------------------------- */

@media screen and (min-width: 769px),print{ 

  /* スライダー */
  
  .keyv {
    width:100%;
    height:auto;
    margin:90px 0 0;
    background:#CCC;
  }
  
  .keyv ul.slider {margin:0;}
  .keyv ul.slick-dots {bottom:15px;}

  
  .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ページ上部バナー */
  
  .index_banner {
    width:100%;
    max-width:960px;
    height:auto;
    overflow:hidden;
    margin:0 auto 100px;
  }
  
  .index_banner li {
    width:49%;
    height:auto;
    float:left;
    margin:0 0 20px;
    font-size:1.05em;
  }
  
  .index_banner li:nth-child(even) {float:right;}
  .index_banner li img {/*max-width:464px;*/width:100%;}
  
  .index_banner li#spring_banner {
    position:relative;
    z-index:0;
  }
  
  .index_banner li#spring_banner::after {
    position:absolute;
    display:block;
    content:"";
    width:34%;
    height:auto;
    padding:33% 0 0;
    background:url(./img/index/spring_after.png) no-repeat center / cover;
    z-index:1;
    bottom:-5%;
    left:-5%;
  }
  .index_banner.index_banner_bottom {margin:80px auto 0;} 
  .index_banner.index_banner_bottom li {width:100%;} 
  
  main article p#top_banner {
    position:relative;
    max-width:960px;
    width:100%;
    margin:0 auto 2%;
    padding: 24% 0 0;
    height: 0;
  }
  main article p#top_banner img {
    position:absolute;
    width:100%;
    max-width:none;
    top:0;
  }
  
  main article p#autumn_banner {
    position:relative;
    max-width:960px;
    width:100%;
    margin:0 auto 2%;
    padding: 24% 0 0;
    height: 0;
  }
  main article p#autumn_banner img {
    position:absolute;
    width:104%;
    max-width:none;
    top:0;
  }
  
  main article p.contest {
    max-width:960px;
    width:100%;
    margin:0 auto 20px;
  }
  
  /* 家庭用商品 */  
  
  section.for_family {
	margin:0 auto 70px;
	max-width:960px;
  }
  section.for_family h2 span {
    display:inline-block;
    font-size:16px;
    margin:0 0 0 2em;
    vertical-align:middle;
    line-height:1.5em;
  }
  
  ul.for_family {
    width:100%;
    height:auto;
    overflow:hidden;
    margin:0 auto 25px;
  }
  
  ul.for_family li {
    box-sizing:border-box;
    position:relative;
    width:18.4%;
    height:auto;
    float:left;
    margin:0 2% 2% 0;
    z-index:0;
    overflow:hidden;
  }
  
  ul.for_family li:nth-child(3),
  ul.for_family li:nth-child(7),
  ul.for_family li:nth-child(12) {
    margin:0 0 2%;
  }
  
  ul.for_family li:nth-child(1),
  ul.for_family li:nth-child(2),
  ul.for_family li:nth-child(3) {
    width:32%;
  }
  
  ul.for_family li:nth-child(4),
  ul.for_family li:nth-child(5),
  ul.for_family li:nth-child(6),
  ul.for_family li:nth-child(7) {
    width:23.5%;
  }
  
  ul.for_family li:nth-child(4),
  ul.for_family li:nth-child(8) {
    clear:both;
  }
  
  ul.for_family li a {
    box-sizing:border-box;
    display:block;
    width:100%;
    height:0;
    padding:100% 0 0;
    font-size:13px;
  }
  
  ul.for_family li:nth-child(1) a,
  ul.for_family li:nth-child(2) a,
  ul.for_family li:nth-child(3) a {
    padding:78.5% 0 0;
    font-size:17px;
  }
  
  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 {
    padding:73.5% 0 0;
    font-size:14px;
  }
  
  ul.for_family li a > span {
    box-sizing:border-box;
    position:absolute;
    display:block;
    width:100%;
    height:auto;
    padding:0.7em 0.5em 0.7em;
    background:rgba(148,119,165,0.7);
    color:#FFF;
    bottom:0;
    z-index:0;
  }
  
  ul.for_family li a > span span {font-size:70%;}
  
  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 li::after {
    position:absolute;
    display:block;
    content:"";
    width:50%;
    height:50%;
    bottom:-2%;
    right:-2%;
    z-index:1;
  }
  
  ul.for_family li.family01::after {background:url(./img/index/fm01.png) no-repeat center / auto 110%;bottom:1%;right:-1%;}
  ul.for_family li.family02::after {background:url(./img/index/fm02.png) no-repeat center / auto 120%;bottom:2%;right:-1%;}
  ul.for_family li.family03::after {background:url(./img/index/fm03.png) no-repeat center / auto 130%;bottom:-2%;right:0%;}
  ul.for_family li.family04::after {background:url(./img/index/fm04.png) no-repeat center / auto 100%;bottom:-4%;right:-4%;}
  ul.for_family li.family05::after {background:url(./img/index/fm05.png) no-repeat center / auto 100%;bottom:-5%;right:-6%;}
  ul.for_family li.family06::after {background:url(./img/index/fm06.png) no-repeat center / auto 100%;bottom:-4%;right:-6%;}
  ul.for_family li.family07::after {background:url(./img/index/fm07.png) no-repeat center / auto 120%;bottom:2%;right:-2%;}
  ul.for_family li.family08::after {background:url(./img/index/fm08.png) no-repeat center / auto 100%;bottom:-4%;right:0%;}
  ul.for_family li.family09::after {background:url(./img/index/fm09.png) no-repeat center / auto 100%;bottom:2%;right:-10%;}
  ul.for_family li.family10::after {background:url(./img/index/fm10.png) no-repeat center / auto 100%;bottom:0%;right:-2%;}
  ul.for_family li.family11::after {background:url(./img/index/fm11.png) no-repeat center / auto 100%;bottom:3%;right:-9%;}
  ul.for_family li.family12::after {background:url(./img/index/fm12.png) no-repeat center / auto 100%;bottom:3%;right:-5%;}
  
  section p.bottom_p {
    font-size:16px;
    line-height:1.8;
    text-align:center;
  }
  
  /* 横並びメニュ */ 
  
  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 0;
  }
  
  ul.index_menu li p.detail::after {
    position:absolute;
    z-index:0;
    display:block;
    content:"";
    width:2em;
    height:1em;
    margin:auto;
    bottom:-30px;
    left:0;
    right:0;
    background:url(./img/index/index_menu_after.png) no-repeat bottom center / cover;
  }
  
  section.for_family ul.index_menu {width:300px;}
  section.for_family ul.index_menu li {width:300px;}
  
  /* 小野製麺のこだわり */
  
  section.kodawari {
    box-sizing:border-box;
    width:100%;
    max-width:1140px;
    margin:0 auto 80px;
    padding:0 20px;
  } 
  section.kodawari h2 {
    position:relative;
    width:100%;
    height:250px;
    margin:0 auto 50px;
    background:url(img/index/bg_kodawari.jpg) no-repeat left;
  }
  section.kodawari h2 span {
    position:absolute;
    display:block;
    width:100%;
    height:37px;
    margin:auto;
    text-align:center;
    top:0;
    bottom:0;
  }
  section.kodawari section {
    width:30%;
    margin:0 5% 50px 0;
    float:left;
    padding:30px 0 0;
    background:url(img/index/bg_notice.png) no-repeat top center / 58%;
  }
  section.kodawari section:nth-of-type(3) {margin:0 0 50px;}
  section.kodawari section h3 {
    font-size:32px;
    text-align:center;
    margin:0 auto 30px;
  }
  section.kodawari section p {min-height:8em;}
  section.kodawari section + p {clear:both;}
  section.kodawari .common_link {
    display:inline-block;
    width:200px;
    margin:50px 20px 0;
  }
  
  /* 人気ランキング */
  
  section.ranking {
	  max-width:1000px;
	  margin:0 auto 80px;
  }
  
  section.ranking ul {
    margin:0 auto;
  }
  
  section.ranking ul li {
    position:relative;
    width:38.5%;
    height:auto;
    margin:0 2.5% 0 0;
    float:left;
    z-index:0;
  }
  section.ranking ul li:nth-child(1) {width:18%;} 
  section.ranking ul li:last-child {margin:0;} 
  
  section.ranking ul li > div {
    position:relative;
    width:46.75%;
    float:left;
    margin:0 6.5% 0 0;
     padding:0 0 60px;
  }
  section.ranking ul li > div:nth-last-of-type(1) {margin:0;}
  section.ranking ul li:nth-child(1) > div {
    width:100%;
    margin:0;
  }
  
  section.ranking ul li > div::before {
    position:absolute;
    display:block;
    content:"";
    width:25%;
    height:30%;
    right:0;
    top:-15px;
  }
  
  section.ranking ul li > div.ranking01::before {background:url(./img/index/rank01_before.png) no-repeat top center /100% auto;}
  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 30px center /80% auto;}
  section.ranking ul li > div.ranking05::before {background:url(./img/index/rank05_before.png) no-repeat top 30px center /80% auto;}
  
  section.ranking ul li p.rank_name {
    font-family: "ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
    font-size:16px;
    color:#714987;
    font-weight:bold;
    height:3em;
    line-height:1.3em;
    display:table-cell;
    vertical-align:middle;
    padding:0 0 10px;
  }

  section.ranking ul li p.rank_detail {
    font-family: "ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
    margin:0 0 0.5em;
    font-size:14px;
    min-height:12em;
  } 
  section.ranking ul li p.rank_detail + p {
    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:16px;
    line-height:1.2;
  }
  section.ranking ul li p.rank_price span {font-size:14px;}
  section.ranking ul li p.common_link {
    position:absolute;
    bottom:0;
    margin:0 auto;
  }
  
  /* 贈答用商品 */
  
  section.for_gift {margin:0 auto 80px;}
  section.for_gift h2 span {
    display:inline-block;
    font-size:16px;
    margin:0 0 0 2em;
    vertical-align:middle;
    line-height:1.5em;
  }
  section.for_gift ul {
    box-sizing:border-box;
    /*max-width:1500px;*/
	  max-width:1200px;  
    width:100%;
    height:auto;
    overflow:hidden;
    margin:0 auto 40px;
  }
  
  section.for_gift ul li {
    width:20%;
    height:auto;
    float:left;
  } 
  
  section.for_gift ul li span {display:none;}
  
  section.for_gift ul.index_menu {width:768px;}
  section.for_gift ul.index_menu li {
    width:384px;
    float:none;
  }  
  
  section.for_gift ul.index_menu li:nth-child(1) img {max-width:327px;}
  section.for_gift ul.index_menu li:nth-child(2) img {max-width:286px;}
  
  /* 中段バナー */
  
  ul.index_middle_banner {
    box-sizing:border-box;
    width:100%;
	  max-width:900px;
    overflow:hidden;
    padding:0 20px;
    margin:0 auto 80px;
  }
  .home #anc01 {
    padding-top:200px!important;
    margin-top:-200px!important;
  }
  ul.index_middle_banner li {
    width:30%;
    margin:0 5% 5% 0;
    float:left;
  }
  ul.index_middle_banner li img {display:block;}
  ul.index_middle_banner li:nth-child(1) ,
  ul.index_middle_banner li:nth-child(2) {
    width:100%;
    margin:0 0 5%;
  }
  ul.index_middle_banner li:nth-child(5),
  ul.index_middle_banner li:nth-child(8) {margin:0 0 5%;}
  ul.index_middle_banner li p {display:none;}
  
  /* 半田めんのおいしいレシピ */
  
  section.recipe {margin:0 0 100px;} 
  section.recipe .wide_area {
    background:url(./img/index/bg_recipe_pc.png) no-repeat center center / cover;
    margin:0 0 70px;
  }
  
  section.recipe .wide_area .box {
    box-sizing:border-box;
    width:100%;
    max-width:1080px;
    padding:2% 40px;
  }
  
  section.recipe .wide_area .box p {
    width:auto;
    height:100%;
  }
  
  section.recipe .wide_area .box p img {height:100%;width:auto;}
  
  section.recipe .wide_area + p {display:none;}
  section.recipe p.link_recipe {display:none;}
  
  section.recipe ul.index_menu {
    width:100%;
	  max-width:1000px;
    overflow:hidden;
  }
  
  section.recipe ul.index_menu > li {
    width:24.25%;
    margin:0 1% 0 0;
    float:left;
    overflow:hidden;
  }
  
  section.recipe ul.index_menu > li:last-child {margin:0;}
  section.recipe ul.index_menu > li div {
    position:relative;
    overflow:hidden;
    margin:0 2% 0 0;
    font-family: "ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
    font-size:16px;
    text-align:left;
    padding:5% 0 0;
  }

  section.recipe ul.index_menu > li div::before {
    position:absolute;
    display:block;
    content:"";
    width:12.5%;
    height:50%;
    top:0;
    right:5%;
    z-index:1;
  }
  
  section.recipe ul.index_menu > li:nth-child(1) div::before {background:url(./img/index/recipe_j.png) no-repeat top center / 100%;}
  section.recipe ul.index_menu > li:nth-child(2) div::before {background:url(./img/index/recipe_w.png) no-repeat top center / 100%;}
  section.recipe ul.index_menu > li:nth-child(3) div::before {background:url(./img/index/recipe_c.png) no-repeat top center / 100%;height:80%;}
  section.recipe ul.index_menu > li:nth-child(4) div::before {background:url(./img/index/recipe_s.png) no-repeat top center / 100%;}
  
  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 img {
    position:absolute;
    width:100%;
    margin:auto;
    top:-100%;
    bottom:-100%;
    left:0;
    right:0;
  }
  
  section.recipe ul.index_menu > li div p {
    font-size:14px;
    font-weight:bold;
    text-align:center;
    line-height:1.4em;
    height:3em;
    margin:0.4em 0 0;
  }
  
  section.recipe ul.index_menu > li p.common_link {
    position:relative;
    box-sizing:border-box;
    width:100%;
    max-width:210px;
  }
  
  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;}
  section.recipe ul.index_menu > li:nth-child(4) p.common_link a {background:#eee6da;}
  section.recipe ul.index_menu > li p.common_link a:hover {background:none;}
  section.recipe ul.index_menu > li:nth-child(1) p.common_link a:hover {border:solid 1px #78c38c;color:#78c38c;}
  section.recipe ul.index_menu > li:nth-child(2) p.common_link a:hover {border:solid 1px #ef8861;color:#ef8861;}
  section.recipe ul.index_menu > li:nth-child(3) p.common_link a:hover {border:solid 1px #e6be46;color:#e6be46;}
  section.recipe ul.index_menu > li:nth-child(4) p.common_link a:hover {border:solid 1px #ab834a;color:#ab834a;}
  
  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:-35px;
    left:0;
    right:0;
    background:url(./img/index/index_menu_after.png) no-repeat bottom center / cover;
  }
  
  /* お知らせ */
  section.recipe + .box {max-width:1040px;}
  
  section.recipe + .box > div:nth-of-type(1) {width:46%;float:left;margin:0 0 80px;}
  section.fb_box {width:46%;float:right;}
  section.fb_box p {font-family: "ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;margin:-8px 0 17px;text-align:center;}
  
  section.notice {
    width:100%;
    height:auto;
    margin:0 0 50px;
    /*float:left;
    height:24%;
    /*margin:0 4% 80px 0;*/
  }
  
  section.notice > div {
    box-sizing:border-box;
    height:230px;
    overflow:hidden;
    background:url(./img/index/bg_notice.png) no-repeat center /auto 80%;
    border:solid 1px #969696;
  }
  
  section.notice dl {
    width:100%;
    height:100%;
    overflow-y:scroll;
    font-family: "ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
    
  }
  
  section.notice dl dt {
    box-sizing:border-box;
    width:30%;
    float:left;
    font-size:14px;
    line-height:1.3em;
    padding:1.5em 0 1.5em 3%;
    clear:both;
  }
  
  section.notice dl dd {
    box-sizing:border-box;
    width:97%;
    padding:1.5em 5% 1.5em 30%;
    border-bottom:solid 1px #c7c7c7;
    font-size:14px;
    line-height:1.3em;
  }
	
  section.notice dl dd a {text-decoration:underline;}
  
  /* 今月のレシピ */
  
  section.monthly {
    width:100%;
    height:auto;
    /*float:left;
    height:auto;
    margin:0 0 80px;*/
  }
  
  section.monthly figure {
    position:relative;
    width:50%;
    height:auto;
    max-height:297px;
    padding:50% 0 0;
    float:left;
    margin:0;
    overflow:hidden;
  }
  
  section.monthly figure img {
    position:absolute;
    width:auto;
    max-width:none;
    height:100%;
    margin:auto;
    top:0;
    bottom:0;
    left:-100%;
    right:-100%;
  }
  
  section.monthly div {
    width:46%;
    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:21px;
    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:57px 0 0;
  }
  
  /* 迷った時は */  
  section.select {margin:0 0 130px;}
  section.select .index_menu {width:100%;/*max-width:1500px;*/max-width:1200px;margin:0 auto;}
  section.select .index_menu li {width:calc(100% / 3);float:left;}
  section.select .index_menu li p.detail {padding:30px 10% 0;}
  section.select .index_menu li p.detail span {display:block;margin:0 0 10px;font-size:18px;}
  section.select .index_menu li:nth-child(1) p.detail img {max-width:260px;}
  section.select .index_menu li:nth-child(2) p.detail img {max-width:272px;}
  section.select .index_menu li:nth-child(3) p.detail img {max-width:236px;}
  
  /* お役立ち情報 */  
  section.select_info {margin:0 0 80px;}
  section.select_info ul {width:100%;/*max-width:1500px;*/max-width:1000px;margin:0 auto;}
  section.select_info ul li {width:32%;float:left;margin:0 2% 0 0;}
  section.select_info ul li:nth-child(3) {margin:0;}
  
  /* お客様の声 */
  
  section.index_voice {margin:0 auto 100px;}
  section.index_voice .box {max-width:1000px;}
  section.index_voice .box dl {
    position:relative;
    /*box-sizing:border-box;*/
    width:38%;
    float:left;
    margin:0 4% 4% 0;
    padding:70px 5% 70px;
    background:url(img/index/bg_index_voice.png) repeat-y top left /100% auto;
  }
  section.index_voice .box dl::before {
    position:absolute;
    display:block;
    content:"";
    width:100%;
    height:65px;
    background:url(img/index/bg_voice_before.png) no-repeat top left / 100% auto;
    top:0;
    left:0;
  }
  section.index_voice .box dl::after {
    position:absolute;
    display:block;
    content:"";
    width:100%;
    height:60px;
    background:url(img/index/bg_voice_after.png) no-repeat bottom left / 100% auto;
    bottom:0;
    left:0;
  }
  
  section.index_voice .box dl:nth-of-type(even) {margin:0 0 4%;}
  section.index_voice .box dl dt {
    font-size:24px;
    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:15px;
    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:20px;
    font-widht:bold;
    color:#714987;
    text-align:right;
    margin:0.5em 0 0;
  }
  
  
  

  /* 薬味 */ 
  
  section.index_wide {
    position:relative;
    box-sizing:border-box;
    width:100%;
    height:auto;
    margin:0;
    padding:30% 0 0;
  }
  section.yakumi {background:url(./img/index/bg_yakumi_pc.png) no-repeat center center / cover;margin:0 0 80px;}
  section.yudekata {background:url(./img/index/bg_yudekata_pc.png) no-repeat center center / cover;}  
  section.seizou {background:url(./img/index/bg_seizou_pc.png) no-repeat center center / cover;}
  
  section.yakumi > p,
  section.yudekata > p,
  section.seizou > p {display:none;}
  
  section.index_wide a {
    display:block;
    width:100%;
    height:100%;
  }
  
  section.index_wide .box {
    position:absolute;
    box-sizing:border-box;
    width:100%;
    max-width:1000px;
    padding:2% 5%;
    height:auto;
    margin:auto;
    top:0;
    bottom:0;
    left:0;
    right:0;
  }
  
  section.index_wide .box h2 {
    position:absolute;
    width:9%;
    height:300px;
    margin:auto;
    bottom:0;
    top:0;
    right:40px;
  }
  
  section.yudekata .box h2 {
    left:40px;
    right:auto;
  }
  
  section.index_wide .box h2 img {
    position:absolute;
    margin:auto;
    bottom:0;
    top:0;
    max-height:100%;
  }
  
  section.yakumi .box p:nth-of-type(1) img {
    position:absolute;
    width:auto;
    height:16vw;
    max-height:180px;
    top:10%;
    left:5%;
  }
  
  section.yudekata .box p:nth-of-type(1) img {
    position:absolute;
    width:auto;
    height:16vw;
    max-height:180px;
    top:10%;
    right:5%;
  }  
  
  section.seizou .box p:nth-of-type(1) img {
    position:absolute;
    width:auto;
    height:16vw;
    max-height:180px;
    top:10%;
    left:5%;
  }  
  
  section.index_wide .box p.common_link {
    position:absolute;
    bottom:10%;
    left:5%;
    border:solid 1px #000;
  }
  
  section.yudekata .box p.common_link {
    left:auto;
    right:5%;
  }
  
  section#houjin {
    padding:200px 0 0;
    margin:-200px auto 100px;
  }
  section#houjin ol {
    width:100%;
    margin:50px auto;
    overflow:hidden;
  }
  section#houjin ol li {
    width:32%;
    float:left;
    margin:0 2% 0 0;
  }
  section#houjin ol li:nth-child(3) {margin:0;}
  section#houjin ol li img {
    display:block;
    width:100%;
  }
  section#houjin ol li p {
    position:relative;
    margin:10px 0 0;
    padding:20px 0 20px 50px;
    font-size:12px;
  }
  section#houjin 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:40px;
    font-weight:bold;
    margin:auto;
    top:0;
    bottom:0;
    left:0;
  }
  
  section.index_about {
    margin:0 0 0;
  }
  
  section.index_about .area_g {
    width:100%;
    height:auto;
    overflow:hidden;
    padding:60px 0 30px;
    background:url(./img/index/bg_about.png) no-repeat center top 50px,#eae4ed;
  }
  
  section.index_about .area_g section {
    width:48%;
    float:left;
    margin:0 4% 0 0;
  }
  
  section.index_about .area_g section:nth-of-type(2) {margin:0;}
  
  section.index_about .area_g section h3 {
    font-size:24px;
    line-height:1.5;
    margin:0 0 0.5em;
  }
  
  section.index_about .area_g section:nth-of-type(1) p.common_link {margin:3em auto 0;}
  section.index_about .area_g section:nth-of-type(2) p.common_link {margin:0 auto 0;}
  section.index_about p.common_link a:hover {background:#9477a5;color:#FFF;}
  section.index_about section figure {overflow:hidden;}
  section.index_about section figure img {display:block;float:left;margin:0 2.6% 0 0;}
  section.index_about section:nth-of-type(1) figure img:nth-of-type(1) {width:31.3%;}
  section.index_about section:nth-of-type(1) figure img:nth-of-type(2) {width:66.1%;margin:0;} 
  section.index_about section:nth-of-type(2) figure img {width:31.6%;}
  section.index_about section:nth-of-type(2) figure img:nth-of-type(3) {margin:0;}
}

@media screen and (min-width: 1200px),print{ 

  section.index_wide {
    height:300px;
    padding:0;
  }
}


@media screen and (min-width: 769px) and (max-width:1000px),print{ 

  section.index_voice .box dl dt {
    font-size:18px;
    margin:0 0 1em;
  }
  section.index_voice .box dl dd {
    font-size:12px;
    line-height:1.8em;
  }
  section.index_voice .box dl dd p {
    font-size:14px;
    margin:0.5em 0 0;
  }
}


/* -----------------------------------------------------------
 固定ページ
----------------------------------------------------------- */

@media screen and (min-width: 769px),print{ 
  
  /**** 会社概要 ****/
  
  div.company + section p.lead {margin-bottom:0;}
  p.master_name {width:700px;margin:0 auto;text-align:center;}
  
  table.table_company {width:100%;margin:0 auto 60px;}
  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:40%;
    padding:1em 0;
    font-weight:normal;
  }
  table.table_company tr td {
    box-sizing:border-box;
    width:60%;
    padding:1em 0;
  }
  table.table_company tr th p {
    width:50%;
    float:right;
  }
  
  dl.history {
    width:100%;
    margin:0 auto;
  }
  
  dl.history dt {
    position:relative;
    box-sizing:border-box;
    width:20%;
    height:70px;
    padding:20px 4% 20px 0;
    float:left;
    clear:both;
    border-right:solid 1px #9577a6;
  }
  
  dl.history dt:nth-of-type(1) {height:90px;padding-top:30px;}
  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:0;}
  dl.history dt:nth-of-type(5) {height:100px;}
  dl.history dt:nth-of-type(8) {height:100px;}
  
  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;
    right:0;
    top:35px;
  }
  
  dl.history dd:nth-of-type(6) span {top:-35px;}
  
  section.award figure {
    width:50%;
  }
  section.award p.bottom_p {margin:1em auto;}
  section.award p.bottom_p:nth-of-type(1) {margin:2em auto 1em;}
  section.award figure:nth-of-type(2) ,section.award figure:nth-of-type(5) {float:left;margin:0 0 1em;}
  section.award figure:nth-of-type(3) ,section.award figure:nth-of-type(6){float:left;margin:0 0 1em;}  
  
  section.access p {text-align:center;font-size:15px;}
  section.access div.map_box {
    width:1000px;
    height:680px;
    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;
    opacity:1;
    transition:0.5s;
  }
  
  p.detail_link:hover {
    opacity:0.6;
    transition:0.5s;
  }
  
  /**** お買い物ガイド ****/ 
  
  section.guide .h4_box {margin-bottom:150px;}
  
  dl.service {
    width:100%;
    height:auto;
    overflow:hidden;
    margin:0 auto 50px;
  }
  
  dl.service dt {
    width:100%;
    margin:0 auto 2em;
  }
  
  dl.service dt span {
    width:150px;
    position:relative;
  }
  
  dl.service dt span::after {
    width:550px;
    height:1px;
    content:"";
    display:block;
    position:absolute;
    background:#714988;
    left:150px;
    bottom:1em;
  }
  
  dl.service dt span img {
    width:auto;
    max-width:none;
  }
  
  dl.service dd {
    box-sizing:border-box;
    width:100%;
    font-size:17px;
    padding:0 1em 1em;
    margin:0 0 40px;
    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:18px;
    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 {
    oveflow:hidden;
    margin:0 0 40px;
  }
  
  section.guide .c_box p {font-size:14px;}
  
  section dl.hososhi {
    /*width:225px;
    margin:0 30px 40px 0;
    float:left;
    texct-align:left;*/
    margin:0 0 30px;
  }
  
  section dl.hososhi dt {margin:0;}
  section dl.hososhi dd {margin:0;overflow:hidden;}
  section dl.hososhi dd img {width:auto;float:left;}
  section dl.hososhi dd span {
    width:380px;
    padding:20px 0 20px 20px;
    float:left;
  }
  
  section.guide .c_box dl.noshi {
    width:31%;
    margin:0 3.5% 40px 0;
    float:left;
  }
  
  section.guide .c_box dl.noshi:nth-of-type(5) {margin:0 0 40px;}

  section.guide .c_box dl.noshi dt {text-align:center;margin:10px 0;}
  
  section dl.fukuro {
    width:auto;
    float:left;
    margin:0 1% 40px 0!important;
  }
  
  section dl.fukuro:nth-of-type(1) {width:19%;}
  section dl.fukuro:nth-of-type(2) {width:19%;}
  section dl.fukuro:nth-of-type(3) {width:16%;}
  section dl.fukuro:nth-of-type(4) {width:16%;}
  section div.fukuro {width:26%;box-sizing:border-box;}
  
  section dl.fukuro dd {height:230px;}
  section dl.fukuro dt {text-align:center;}
  
  section.guide .c_box figure {
    position:absolute;
    bottom:30px;
    right:30px;
    width:160px;
    height:105px;
  }
  
  section.guide .c_box p.tel {
    display:inline-block;
    float:left;
  }
  
  section.guide .c_box p.tel + p {
    display:inline-block;
    margin:0 0 1em 1em;
  }
  
  /**** 品質保証について ****/   
  
  section.quality figure {margin:0 auto 50px;}
  section.quality figure figcaption {font-size:12px;text-align:left;width:450px;margin:0 auto;line-height:1.5em;}
  section.quality .c_box h5 {font-size:18px;}
  ul.fact {margin:0 auto;overflow:hidden;}
  ul.fact li {
    width:46%;
    margin:0 8% 8% 0;
    float:left;
  }
  
  ul.fact li:nth-of-type(even) {margin:0 0 8%;}
  ul.fact li p {font-size:14px;}
  
  section.quality p.store_link {margin-top:100px;}
  
  /**** 半田めんについて ****/  
  section.about figure figcaption {font-size:14px;text-align:right;}
  section dl.about {overflow:hidden;margin:80px 0 0px;}
  section dl.about dt {
    width:25.7%;
    margin:0 4.3% 30px 0;
    float:left;
    clear:both;
  }
  section dl.about dd {
    width:70%;
    margin:0 0 30px;
    float:left;
    font-size:14px;
    padding:1em 0 0;
  }
  
  section dl.about dt:nth-of-type(2) {
    margin:0 0 4.3% 30px;
    float:right;
  }
  
  section dl.about dd:nth-of-type(2) {float:right;}
  
  section dl.compair {overflow:hidden;margin:60px 0;}
  section dl.compair dt {
    width:26%;
    margin:0 0 45px;
    float:left;
    clear:both;
    padding:15px 0 0;
  }
  section dl.compair dd {
    width:31%;
    margin:0 0 45px 2%;
    float:left;
  }
  section dl.compair dd.compair_text {
    width:41%;
    margin:0 0 45px;
    font-size:14px;
    padding:15px 0 0;
  }
  
  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;
    opacity:1;
    transition:0.5s;
  }
  
  section dl.compair dd.compair_text p.detail_link:hover {
    opacity:0.6;
    transition:0.5s;
  }
  
  /**** ゆで方について ****/  
  
  section.point {
    box-sizing:border-box;
    width:100%;
    max-width:1040px;
    padding:0 20px;
    margin:0 auto 40px;
  }
  
  section.point ul {
    overflow:hidden;
    margin:0;
    clear:both;
  }
  
  section.point ul li {
    position:relative;
    float:left;
    overflow:hidden;
    background:#ebe5ee;
  }
  
  section.point:nth-of-type(odd) ul li {
    width:48.7%;
    height:300px;
    margin:0 2.6% 0 0;
  }
  
  section.point:nth-of-type(even) ul li {
    width:31.6%;
    margin:0 2.6% 0 0;
    min-height:440px;
  }
  
  section.point ul li:last-child {margin:0;} 
  section.point ul li figure {margin:0;}
  section.point ul li figure img {display:block;}
  
  section.point ul li dl {
    position:relative;
    margin:0;
  }
  
  section.point ul li dl dt {text-align:center;}
  section.point ul li dl dd {box-sizing:border-box;padding:1em 7%;font-size:14px;line-height:1.5em;}
  
  section.point:nth-of-type(odd) ul li figure {
    position:absolute;
    z-index:0;
    width:315px;
    height:300px;
    margin:auto;
    top:-100%;
    bottom:-100%;
    right:35.7%;
  }
  section.point:nth-of-type(odd) ul li dl {width:35.3%;background:#ebe5ee;margin:0 0 0 64.7%;}
  section.point:nth-of-type(odd) ul li dl::before {
    position:absolute;
    display:block;
    content:"";
    width:0;
    height:0;
    border-right:solid 1.6em #ebe5ee;
    border-top:solid 1em transparent;
    border-bottom:solid 1em transparent;
    top:2em;
    left:-1.6em;
  }
  section.point:nth-of-type(odd) ul li dl dt {padding:1em 0 0;}
  section.point:nth-of-type(odd) ul li dl dt img {width:36.6%;}
  
  section.point:nth-of-type(even) ul li dl::before {
    position:absolute;
    display:block;
    content:"";
    width:0;
    height:0;
    border-bottom:solid 1.6em #ebe5ee;
    border-left:solid 1em transparent;
    border-right:solid 1em transparent;
    top:-1.6em;
    left:2em;
  }
  section.point:nth-of-type(even) ul li dl dt {width:29%;padding:1em 0;float:left;}
  section.point:nth-of-type(even) ul li dl dt img {width:66.5%;margin:1em 0;} 
  section.point:nth-of-type(even) ul li dl dd {width:71%;float:left;}
  
  section.point:nth-of-type(2) ul li:nth-child(2) dd {padding-top:50px;}
  section.point:nth-of-type(2) ul li:nth-child(3) dd {padding-top:30px;}
  
  section.point:nth-of-type(4) ul li {
    min-height:auto;
    background:none;
    text-align:center;
    font-size:18px;
  }
  
  div.youtube {
    position:relative;
    width:100%;
    max-width:800px;
    height:450px;
    margin:120px auto ;
    background:#CCC;
  }
  
  div.youtube iframe {
    position:absolute;
    width:100%;
    height:100%;
  }
  
  div.cooking p {
    font-family: "ヒラギノ明朝 ProN W6", "HiraMinProN-W6","游明朝",YuMincho,"Yu Mincho","HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
    position:relative;
    width:calc(100% - 150px);
    height:auto;
    margin:0 0 1em;
    padding:0 0 0 150px;
  }
  
  div.cooking p:nth-of-type(3) {margin:0;}
  
  div.cooking p span {
    position:absolute;
    width:140px;
    height:25px;
    clear:both;
    text-align:center;
    font-size:22px;
    color:#714988;
    margin:auto;
    top:0;
    bottom:0;
    left:0;
  }

  main article ul.point_banner {margin:50px auto;}
  
  /**** 豆知識 ****/
  
  ul.tab_menu {
    box-sizing:border-box;
    width:100%;
    max-width:1040px;
    height:40px;
    padding:0 20px;
    margin:0 auto 50px;
  }
  
  ul.tab_menu > li {
    box-sizing:border-box;
    position:relative;
    width:25%;
    height:40px;
    line-height:40px;
    float:left;
    text-align:center;
    font-size:16px;
    background:#FFF;
    color:#000;
    border:solid 1px #9577a6;
    border-right:none;
    cursor:pointer;
  }
  
  ul.tab_menu > li:last-child {border-right:solid 1px #9577a6;}
  
  ul.tab_menu > li.active {
    background:#9577a6;
    color:#FFF;
  }
  
  ul.tab_menu > li.active::after {
    position:absolute;
    display:block;
    content:"";
    width:0;
    height:0;
    border-top:solid 1em #9577a6;
    border-left:solid 0.67em transparent;
    border-right:solid 0.67em transparent;
    margin:auto;
    left:0;
    right:0;
    top:39px;
  }
  
  .tab_content {
    display:none;
    box-sizing:border-box;
  }
  
  .tab_content.active {display:block;}
  
  section.tab_content h2 {
    width:100%;
    height:40px;
    background:#ebe5ee;
    text-align:center;
    line-height:40px;
    font-size:18px;
    color:#714988;
    margin:0 0 50px;
  }
  
  section.tab_content dl {
    width:100%;
    margin:0 auto 50px;
    overflow:hidden;
    clear:both;
  }
  
  section.tab_content dl dt {
    width:350px;
    margin:0 0 20px;
    float:right;
    font-size:24px;
    color:#714988;
    line-height:40px;
  }
  
  section.tab_content dl dd:nth-of-type(1) {
    width:280px;
    margin:0;
    float:left;
  }
  
  section.tab_content dl dd:nth-of-type(2) {
    width:350px;
    margin:0;
    float:right;
  }
  
  article.trivia_all section.tab_content dl dd p.detail_link {
    display:block;
    width:250px;
    max-width:none;
    margin:20px 0 0;
    clear:both;
    padding:0 1em;
    transition:0.5s;
    opacity:1;
  }
  
  article.trivia_all section.tab_content dl dd p.detail_link:hover {
    transition:0.5s;
    opacity:0.6;
  }
  
  /**** よくある質問 ****/ 
  
  ul.tab_qa > li {
    width:33.3%;
  }
  
  div.qa_content {
    box-sizing:border-box;
    width:100%;
    max-width:1000px;
    margin:0 auto 60px;
  }
  
  div.qa_content ul.tab_qa_sub {
    position:relative;
    width:100%;
    box-sizing:border-box;
    max-width:1040px;
    padding:30px 15px;
    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 10px;
    font-size:16px;
    cursor:pointer;
    width:700px;
  }
  
  div.qa_content ul.tab_qa_sub li:hover,
  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:60px auto;
    background:url(./img/sub/bg_qa.png) no-repeat center center ,#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:-2.5em;
    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:30px 30px 30px 125px;
    color:#714988;
    font-size:18px;
  }
  
  div.qa_content dl.qa_content_sub dt::before {
    position:absolute;
    display:block;
    content:"";
    width:36px;
    height:36px;
    background:url(./img/sub/bg_q.png) no-repeat center / cover;
    margin:auto;
    top:-100%;
    bottom:-100%;
    left:80px;
  }
  
  div.qa_content dl.qa_content_sub dd {
    position:relative;
    display:block;
    width:auto;
    height:auto;
    min-height:80px;
    padding:30px 30px 30px 125px;
    font-size:15px;
  }
  
  div.qa_content dl.qa_content_sub dd::before {
    position:absolute;
    display:block;
    content:"";
    width:32px;
    height:36px;
    background:url(./img/sub/bg_a.png) no-repeat center / cover;
    top:40px;
    left:82px;
  }
  
  div.qa_content dl.qa_content_sub dd p.detail_link {width:300px;background:none;border:solid 1px #000;margin:1em 0 0;transition:0.5s;opacity:1;}
  div.qa_content dl.qa_content_sub dd p.detail_link:hover {transition:0.5s;opacity:0.6;}
  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 0;}
  div.qa_content dl.qa_content_sub dd img.center {margin:1em auto;}
  
  /**** 製造工程 ****/
  
  div.process {
    box-sizing:border-box;
    width:100%;
    height:auto;
    max-width:840px;
    margin:0 auto 80px;
    padding:0 20px;
    /*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 80px;*/
    margin:0 auto 40px;
    overflow:hidden;
    z-index:0;
    /*padding:55% 0 0;*/
    padding:45% 0 0;
    max-width:640px;
  } 

  div.process div.process_nav_text {
    box-sizing:border-box;
    position:relative;
    width:100%;
    max-width:760px;
    height:100px;
    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);
    margin:auto;
    top:0;
    bottom:0;
    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);
    margin:auto;
    top:0;
    bottom:0;
    right:0.5em;
    z-index:1;
    cursor:pointer; 
  }

  div.process div.process_nav_text ul.process_nav li {
    padding:0 50px;
    text-align:left;
  }
  
  div.process_ctr {
    position:relative;
    width:100%;
    height:100px;
    /*margin:0 0 30px;*/
    margin:0;
  }
  
  div.process div.process_ctr span {
    position:absolute;
    display:block;
    content:"";
    width:0;
    height:0;
    border-top:solid 0.7em #a50000;
    border-left:solid 0.7em transparent;
    border-right:solid 0.7em transparent;
    top:-1em;
    left:-1.6%;
    z-index:0;
  }
  
  div.process .process_ctr ul {
    position:relative;
    width:110%;
    max-width:1100px;
    height:100px;
    z-index:2;
    margin:0 0 0 -5%;
  }
  
  div.process div.process_ctr ul::after {
    position:absolute;
    display:block;
    content:"";
    width:calc(100% / 1.1);
    height:2px;
    margin:auto;
    left:0;
    right:0;
    top:3px;
    background:#9577a6;
    z-index:0;
  }
  
  div.process div.process_ctr ul li {
    width:calc(100% / 12.01);
    float:left;
    position:relative;
    text-align:center;
    z-index:1;
    cursor:pointer;
    padding:24px 0 0;
    font-size:25px;
    font-family: "Times New Roman" ,serif;
    font-style:italic;
  }
  
  div.process div.process_ctr ul li.active {color:#ab0006;font-size:36px;padding:24px 0 0;}
  
  div.process div.process_ctr ul li::before {
    position:absolute;
    display:block;
    content:"";
    width:8px;
    height:8px;
    border-radius:50%;
    background:#714988;
    margin:auto;
    top:0;
    left:0;
    right:0;
    z-index:1;
  }
  
  div.process div.process_ctr ul li.active::before {
    width:12px;
    height:12px;
    background:#a50000;
    top:-2px;
  }
  
  div.process div.process_ctr ul li::after {
    position:absolute;
    display:block;
    font-size:17px;
    color:#000;
    top:-50px;
  }
  
  div.process div.process_ctr ul li.pn01::after {
    content:"START";
    right:0;
  }
  
  div.process div.process_ctr ul li.pn12::after {
    content:"GOAL";
    left:0;
  }
  
  div.process div.process_ctr ul li p {
    display:block;
    position:absolute;
    width:8em;
    height:auto;
    padding:0.3em 0.5em;
    background:#c5b4ce;
    color:#FFF;
    transition:0.5s;
    z-index:2;
    opacity:0;
    text-align:center;
    margin:auto;
    top:3.5em;
    left:-100%;
    right:-100%;
    font-size:20px;
    font-style:normal;
    font-family: "ヒラギノ明朝 ProN W6", "HiraMinProN-W6","游明朝",YuMincho,"Yu Mincho","HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
  }
  
  div.process div.process_ctr ul li:hover p {
    opacity:1;
    transition:0.5s;
  } 
  
  div.process div.process_ctr ul li.active p {color:#FFF;}
  
  div.process div.process_ctr ul li:nth-child(1) p {left:2em;right:auto;width:11em;}
  div.process div.process_ctr ul li:nth-child(12) p {left:auto;right:2em;}
  
  div.process div.process_ctr ul li p::before {
    position:absolute;
    display:block;
    content:"";
    width:0;
    height:0;
    border-bottom:solid 1em #c5b4ce;
    border-left:solid 0.5em transparent;
    border-right:solid 0.5em transparent;
    margin:auto;
    top:-1em;
    left:0;
    right:0;
  }
  
  div.process div.process_ctr ul li:nth-child(1) p::before {left:0.5em;right:auto;}
  div.process div.process_ctr ul li:nth-child(12) p::before {left:auto;right:0.5em;}
  
  /**** 配送・送料・返品について ****/
  
  div.m_box section {margin:0 auto 50px;}
  
  table.area {
    width:100%;
    margin:0 auto;
  }
  
  table.area th {
    box-sizing:border-box;
    width:23%;
    background:#9577a6;
    border:solid 1px #714988;
    text-align:center;
    color:#FFF;
    height:40px;
    font-weight:normal;
    letter-spacing:0.8em;
    text-indent:0.4em;
  }
  
  table.area th:nth-of-type(3) {
    width:54%;
    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:40px;
    font-weight:normal;
    font-weight:bold;
    padding:0.4em 0 0;
  }
  
  table.area td:nth-of-type(1) {color:#714988;}
  table.area td:nth-of-type(1) span {font-family:"arial",sans-serif;font-size:21px;}
  table.area td:nth-of-type(3) {
    text-align:left;
    padding:0.4em 0 0 1.5em;
    font-weight:normal;
  }
  
  div.order_date img {float:left;margin:0 30px 0 0;}
  div.order_date p {margin:0 0 0.5em;}
  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:30px;
    line-height:1.3em;
    color:#a40000;
    margin:0;
  }
  
  div.order_date p:nth-of-type(3) span {
    font-size:1.5em;
    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 80px;
  }
  section.condiment {
    width:100%;
    margin:0 auto 120px;
  }
  
  section.condiment h2 {width:700px;margin:0 auto 30px;}
  
  section.condiment ul {
    box-sizing:border-box;
    width:100%;
    max-width:1040px;
    padding:0 20px;
    margin:0 auto;
  }
  
  section.condiment ul li {
    position:relative;
    width:31.5%;
    margin:0 2.6% 2.6% 0;
    float:left;
    height:auto;
    padding:22.5% 0 0;
    z-index:0;
    color:#FFF;
    /*font-size:1.2vmin;*/
    font-size:0.9em;
    line-height:1.5em;
    background:#a58c64;
  }
  
  section.condiment ul li:nth-child(7n + 3) ,
  section.condiment ul li:nth-child(7n + 5) {margin:0 0 2.6%;}
  section.condiment ul li:nth-child(7n + 6) {float:right;margin:-25.1% 34.3% 0 0;}
  section.condiment ul li:nth-child(7n + 7) {float:right;margin:-25.1% 68.5% 0 0;}
  
  section.condiment ul li:nth-child(7n + 1) ,
  section.condiment ul li:nth-child(7n + 5) {padding:47.5% 0 0;}
  
  section.condiment ul li figure {
    position:absolute;
    top:0;
    left:0;
    z-index:0;
    width:61.9%;
  }
  
  section.condiment ul li:nth-child(7n + 1) figure ,
  section.condiment ul li:nth-child(7n + 5) figure {width:100%;}
  section.condiment ul li figure img {display:block;}
  
  section.condiment ul li dl {
    position:absolute;
    top:0;
    right:0;
    z-index:1;
    width:38.1%;
    height:100%;
  }
  
  section.condiment ul li:nth-child(7n + 1) dl ,
  section.condiment ul li:nth-child(7n + 5) dl {
    width:100%;
    height:36.84%;
    top:auto;
    bottom:0;
  }
  
  section.condiment ul li dl dt {
    width:21%;
    height:50%;
    margin:0 auto;
  }
  
  section.condiment ul li:nth-child(7n + 1) dl dt,
  section.condiment ul li:nth-child(7n + 5) dl dt {
    width:8%;
    height:60%;
  }
  
  section.condiment ul li:nth-child(8) dl dt {
    width:19%;
    height:60%;
  }
  
  section.condiment ul li dl dt img {margin:70% 0 0;}
  section.condiment ul li:nth-child(8) dl dt img {margin:30% 0 0;}

  section.condiment ul li dl dd {
    box-sizing:border-box;
    width:100%;
    height:50%;
    padding:0 7% 5%;
  }
  
  section.condiment ul li:nth-child(7n + 1) dl dd,
  section.condiment ul li:nth-child(7n + 5) dl dd {
    width:80%;
    height:40%;
    margin:0 auto;
  }
  
  .check div.cooking p {
    width:calc(100% - 200px);
    padding:0 0 0 200px;
  }
  
  .check div.cooking p span {
    width:190px;
  }
  
  /**** お客さまの声 ****/
  
  section.voice {
    box-sizing:border-box;
    width:100%;
    margin:0 auto 30px;
    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:21px;
    color:#714988;
    margin:0;
    padding:1em 60px;
    border-bottom:solid 1px #714988;
  }
  
  section.voice h2 + div {
    padding:30px 60px;
  }
  section.voice h2 + div p {font-size:14px;}
  section.voice h2 + div p.customer {color:#a40000;font-size:16px;}
 
  main article.voice_all p.common_link {display:inline-block;margin:30px 15px 50px;width:240px;height:auto;}
  main article.voice_all p.common_link a {display:block;width:100%;height:100%;}
  
  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:18px;
    padding:1em 0;
    margin:0 auto 60px;
	  clear:both;
  }
  
  div.pagenation a ,
  div.pagenation span {
    display:inline-block;
    width:2em;
    color:#c8c8c8;
  }
  div.pagenation a:hover,
  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 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:130px;
    height:auto;
    font-size:18px;
    color:#FFF;
    text-align:center;
    vertical-align:middle;
    padding:0.5em 0;
  }
  
  dl.payment dd {
    display:table-cell;
    width:calc(100% - 140px);
    height:auto;
    font-size:14px;
    background:#ebe5ee;
    padding:0.5em 0 0.5em 10px;
    vertical-align:middle;
  }
  
  dl.payment dd span {
    display:inline-block;
    margin:0 0 0;
    font-size:13px;
  }
  
  dl.payment dd span::before {content:"※";}
  
  /**** お買い物の流れ ****/
  section.flow {margin:0 0 70px;}
  section.flow h2 {max-width:1000px;text-align:center;margin:0 auto 40px;}
  section.flow h2 img {width:auto;}
  
  section.flow ul.tab_menu li {width:calc(100%/5);font-size:1.5vmin;}
  
  section.flow section.tab_content h3 {
    width:100%;
    height:40px;
    color:#714988;
    font-size:18px;
    text-align:center;
    line-height:40px;
    background:#ebe5ee;
    margin:0 0 50px;
  }
  
  section.flow section.tab_content dl {
    font-family: "ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
    width:23%;
    margin:0 2% 5% 0;
    float:left;
    clear:none;
  }
  
  section.flow section.tab_content dl:nth-of-type(4n) {
    margin:0 0 5%;
  }
  
  section.flow section.tab_content dl.flow02 {
    font-family: "ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
    width:48%;
    margin:0 2% 5% 0;
    float:left;
    clear:none;
  }
  
  section.flow section.tab_content dl dt {
    width:100%;
    font-size:15px;
    color:#000;
    line-height:1.5em;
    margin:0 0 10px;
  }
  
  section.flow section.tab_content dl dd {
    width:100%;
    font-size:14px;
  }
  
  section.c_section {
    background:#ebe5ee;
    padding:25px 0 25px;
  }
  section.c_section h2 ,
  section.c_section h3 {
    font-size:24px;
    color:#714988;
    padding:0 25px 10px;
    border-bottom:solid 1px #714988;
    margin:0 0 20px;
  }
  section.c_section h2 + div ,
  section.c_section h3 + div {
    padding:0 40px;
    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 10px;}
  ol.circle li span.num {position:absolute;top:0;left:0;}
  ol.circle li p.address {font-size:18px;font-weight:bold;}
  ol.circle li p.address span {display:block;font-size:24px;}
  
  p.dl_link {
    display:inline-block;
    width:auto;
    height:30px;
    line-height:30px;
    margin:1em 0 0;
    opacity:1;
    transition:0.5s;
  }
  
  p.dl_link:hover {
    opacity:0.6;
    transition:0.5s;
  }
  
  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 {
    max-width:420px;
    width:50%;
    float:right;
    margin:0 8% 100px; 
    
  }
  
  /*section.pack ul.slider:nth-of-type(3) {margin:0 8%;}*/
  
  section.pack figure {
    width:30%;
    float:left;
    margin:40px 0 0;
  }
  
  section.pack figure figcaption {
    font-size:15px;
    text-align:left;
  }
  
  section.pack div.fukuro {
    float:left;
    background:#ebe5ee;
    padding:0.5em;
    margin:30px 0 0;
  }
  
  section.pack div.fukuro p {
    font-size:12px;
    margin:0 0 5px;
  }
  
  table.noshi_type {width:100%;clear:both;box-sizing:border-box;}
  
  table.noshi_type caption {text-align:left;}
  
  table.noshi_type th {
    box-sizing:border-box;
    height:40px;
    text-align:center;
    vertical-align:middle;
    color:#FFF;
    background:#9577a6;
    border:solid 1px #714988;
    font-weight:normal;
    font-size:18px;
  }
  
  table.noshi_type td {
    box-sizing:border-box;
    text-align:center;
    vertical-align:middle;
    height:60px;
    border:solid 1px #714988;
    font-weight:normal;
    font-size:14px;
    line-height:1.2em;
  }
  
  table.noshi_type td:nth-last-of-type(3) img {width:50%;}
  table.noshi_type td:nth-last-of-type(2) {font-size:15px;color:#714988;font-weight:bold;}
  table.noshi_type td:nth-last-of-type(1) {text-align:left;padding:0 1.2em;}
  
  table.mscard {
    box-sizing:border-box;
    position:relative;
    width:99.8%;
    z-index:0;
    margin:0 auto 30px;
  }
  
  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;
    font-size:17px;
    color:#714988;
    margin:75px 0 0;
  }
  
  table.mscard caption span {
    font-size:24px;
  }
  
  table.mscard th {
    box-sizing:border-box;
    height:50px;
    text-align:center;
    vertical-align:middle;
    color:#FFF;
    background:#9577a6;
    border:solid 1px #714988;
    font-weight:normal;
    font-size:20px;
  }
  
  table.mscard th:nth-of-type(1) {
    font-size:30px;
    font-family: "Times New Roman" ,serif;
    font-style:italic;
  }
  
  table.mscard td {
    box-sizing:border-box;
    vertical-align:middle;
    height:65px;
    border:solid 1px #714988;
    font-weight:normal;
    font-size:15px;
    line-height:1.2em;
    text-align:left;
    padding:0 1.2em;
  }
  
  table.mscard td:nth-of-type(1) {
    font-size:30px;
    font-family: "Times New Roman" ,serif;
    font-style:italic;
    color:#714988;
  }
  
  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;vertical-align:middle;margin:0 1em 0 0;}
  
  .table_form {
    width:600px;
    margin:0;
    font-size:15px;
    text-align:left;
    vertical-align:middle;
    overflow:visible;
  }
  
  .table_form caption {margin:0 0 30px;text-align:left;}
  
  .table_form th {
    box-sizing:border-box;
    width:200px;
    padding:15px 0 15px 10px;
    text-align:left;
  }
  
  .table_form th.v_top {vertical-align:top;}
  
  .table_form th.abs {position:relative;}
  .table_form th.abs span {
    position:absolute;
    width:240px;
    height:1.2em;
    margin:auto;
    top:0;
    bottom:0;
  }
  
  .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 {
    width:350px;
    padding:15px 0 15px 50px;
  }
  
  .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 {
    width:400px;
    padding:15px 0;
    vertical-align:middle;
  }
  
  .table_form td.label span.label {
    width:45px;
    display:inline-block;
    font-size:14px;
    text-align:right;
    padding:0 5px 0 0;
  }
  
  .table_form td.label label:nth-of-type(2) {float:right;}
  
  .table_form td.seibetsu label {width:100px;height:15px;float:left;}
  .table_form td.seibetsu label:nth-of-type(2) {float:left;}
  
  .table_form td input {
    box-sizing:border-box;
    width:100%;
    height:40px;
    padding:0 0.5em;
    font-size:14px;
    border:solid 1px #c8c8c8;
  }
  
  .table_form td.label input {width:135px;}
  .table_form td.label [type="radio"] {width:40px;height:15px;}
  .table_form td textarea {
    box-sizing:border-box;
    width:100%;
    height:200px;
    margin:0;
    padding:0 0.5em;
    border:solid 1px #c8c8c8;
  }
  
  .table_form td select {
    box-sizing:border-box;
    width:110px;
    height:40px;
    margin:0;
    padding:0 0.5em;
    border:solid 1px #c8c8c8;
  } 
  
  .table_form td.post {position:relative;}
  .table_form td.post span.post {padding:0 0.5em}
  .table_form td.post span.abs {
    position:absolute;
    height:1.2em;
    margin:auto;
    top:0;
    bottom:0;
    right:-120px;
  }
  
  .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:150px;
    height:50px;
    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 100px;}
  
  /**** カタログ請求 ****/ 
  
  p.catalog_lead span {
    display:block;
    margin:2em auto 0;
    text-align:center;
  }
  
  /**** 新規会員登録 ****/ 
  
  section.register {
    position:relative;
    box-sizing:border-box;
    width:100%;
    max-width:1040px;
    margin:0 auto 120px;
    height:auto;
    padding:25px 20px 0;
  }
  
  section.register > div {
    width:100%;
    height:auto;
    margin:0;
    box-sizing:border-box;
    border:solid 1px #714988;
    z-index:0;
    padding:80px 100px;
    overflow:hidden;
  }
    
  section.register div h2 {
    position:absolute;
    display:block;
    width:540px;
    height:40px;
    line-height:40px;
    font-size:32px;
    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%;
    padding:0 0 0 160px;
    position:relative;
    margin:0 auto 1em;
  }
    
  section.register div dl dt {
    font-size:24px;
    line-height:1.4em;
    color:#714988;
    margin:0 0 10px;
  }
  
  section.register div dl dt span {
    position:absolute;
    height:55px;
    margin:auto;
    top:0;
    bottom:0;
    left:0;
  }
  
  section.register div dl + figure {margin:0 auto 80px;}
  
  /**** 初回限定 ****/ 
  
  section.first {margin:0 0 20px;}
  section.first h2 {
    box-sizing:border-box;
    width:80%;
    max-width:500px;
    padding:0 20px;
    margin:0 auto 40px;
  }
  section.first img {width:100%;}
  section.first p.free_mes {
    width:100%;
    height:40px;
    line-height:40px;
    font-size:24px;
    text-align:center;
    color:#FFF;
    background:#9577a6;
  }
  
  section.first p.lead {font-size:1.3em;}
  section.first div.c_box {
    width:700px;
    margin:0 auto 50px;
    background:none;
    border:solid 1px #714988;
  }
  div.camp {
    position:relative;
    width:100%;
    max-width:700px;
    height:auto;
    margin:0 auto 40px;
  }
  
  div.camp p.common_link {
    position:absolute;
    margin:auto;
    left:0;
    right:0;
    bottom:20px;
  }
  
  div.camp p.common_link a {
    color:#FFF;
    background:#714988;
  }
  
  /**** キャンペーン ****/ 
  
  section.campaign h2 {
    box-sizing:border-box;
    width:839px;
    max-width:96%;
    padding:0 20px;
    margin:0 auto 60px;
  }  
  
  section.campaign div.free_mes {
    width:100%;
    height:auto;
    padding:5px 0;
    margin:0 0 60px;
    text-align:center;
    color:#D83657;
    background:#FFD1D6;
  }
  
  section.campaign div.free_mes p {
    position:relative;
    width:700px;
    padding:0 20px;
    height:40px;
    line-height:40px;
    font-size:32px;
    margin:0 auto;
    max-width:96%;
    text-align:left;
  }
  
  section.campaign div.free_mes p span {
    display:inline-block;
    width:auto;
    height:36px;
    line-height:36px;
    padding:0 0.25em;
    font-size:27px;
    color:#FFF000;
    background:#AAB34C;
    margin:0 0.5em 0 0;
  }
  
  section.campaign div.free_mes p::after {
    position:absolute;
    display:block;
    content:"";
    width:166px;
    height:170px;
    background:url(./img/campaign/free_mes_after.png) no-repeat center / cover;
    margin:auto;
    top:0;
    bottom:0;
    right:0;
  }
  
  section.camp_autumn div.free_mes {background:#eb4d05;}
  
  section.camp_autumn div.free_mes p {color:#ffe363;font-size:32px;line-height:40px;}
  
  section.camp_autumn div.free_mes p span {background:#ffe363;color:#eb4d05;font-size:24px;height:32px;line-height:32px;}
  
  section.camp_autumn div.free_mes p::after {
    width:255px;
    height:172px;
    background:url(./img/campaign/free_mes_after_a.png) no-repeat center / cover;
  }
  
  section.campaign div.camp {
    padding:30px 0 60px;
    background: #FFFFFF;
    background: -moz-linear-gradient( #FBF9EC 0%, #FFFFFF 100%);
    background: -webkit-gradient(linear, left top, left bottom, from(#FBF9EC), to(#FFFFFF));
    background: -webkit-linear-gradient( #FBF9EC 0%, #FFFFFF 100%);
    background: -o-linear-gradient( #FBF9EC 0%, #FFFFFF 100%);
    background: -ms-linear-gradient( #FBF9EC 0%, #FFFFFF 100%);
    background: linear-gradient( #FBF9EC 0%, #FFFFFF 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr=#FBF9EC, endColorstr=#FFFFFF,GradientType=0 );
  }
  
  section.camp_autumn div.camp {
    background: -moz-linear-gradient( #fff6e8 0%, #FFFFFF 100%);
    background: -webkit-gradient(linear, left top, left bottom, from(#fff6e8), to(#FFFFFF));
    background: -webkit-linear-gradient( #fff6e8 0%, #FFFFFF 100%);
    background: -o-linear-gradient( #fff6e8 0%, #FFFFFF 100%);
    background: -ms-linear-gradient( #fff6e8 0%, #FFFFFF 100%);
    background: linear-gradient( #fff6e8 0%, #FFFFFF 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr=#fff6e8, endColorstr=#FFFFFF,GradientType=0 );
  }
  
  section.campaign div.camp > div {
    margin:0 20px;
    overflow:hidden;
  }
  section.campaign div.camp > div > figure {margin:30px auto;}
  section.campaign div.camp .set_mes {
    position:relative;
    box-sizing:border-box;
    width:100%;
    height:auto;
    margin:0 0 50px;
    padding:0.5em 180px 0.4em 20px;
    font-size:21px;
    background:#FFD1D6;
    color:#D83657;
  }
  
  section.campaign div.camp .set_mes span {
    position:absolute;
    display:block;
    width:170px;
    height:170px;
    margin:auto;
    top:0;
    bottom:0;
    right:0;
  }
  
  section.campaign div.camp .camp_price {
    width:48%;
    float:left;
  }
  
  section.campaign div.camp .camp_set {
    width:48%;
    float:right;
  } 
  
  section.campaign div.camp p.common_link a {
    transition:0.5s;
    opacity:1;
    background:#D83657;
  }
  
  section.campaign div.camp p.common_link a:hover {opacity:0.5;}
  
  section.camp_autumn div.camp > div {
    margin:0 40px;
  }
  
  section.camp_autumn div.camp .set_mes {
    background:#ffe363;
    color:#e60012;
    padding:0.5em 40px 0.4em; 
  }
  section.camp_autumn div.camp .set_mes span {right:-20px;}
  section.camp_autumn div.camp p.common_link a {
    background:#e60012;
  }
  
  /**** レシピ一覧 ****/ 
  
  div.recipe_nav {
    position:relative;
    width:100%;
    height:130px;
  }
  
  div.recipe_nav ul.tab_menu li {width:calc(100% / 3);}
  div.recipe_nav ul.tab_menu li a{display:block;width:100%;height:100%;}
  div.recipe_nav div.tab_content {
    position:absolute;
    width:100%;
    height:40px;
    bottom:20px;
    background:#ebe5ee;
  }
  
  div.recipe_nav div.tab_content ul {
    box-sizing:border-box;
    width:100%;
    max-width:1040px;
    height:100%;
    margin:0 auto;
    text-align:center;
    font-size:0;
    padding:0 20px;
  }
  
  div.recipe_nav div.tab_content ul li {
    width:calc(100% / 3);
    position:relative;
    display:inline-block;
    text-align:center;
    line-height:40px;
    margin:0;
    padding:0;
    font-size:14px;
  }
  
  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 60px;
    overflow:hidden;
    font-family: "ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  }
  
  ul.recipe_all > li {
    position:relative;
    width:31.666%;
    margin:0 2.5% 2.5% 0;
    float:left;
    height:auto;
    padding:22.5% 0 0;
    z-index:0;
    color:#000;
    /*font-size:1.2vmin;*/
    font-size:14px;
    line-height:1.5em;
    background:#f5faf0;
  }
  
  ul.recipe_all > li:nth-child(7n + 3) ,
  ul.recipe_all > li:nth-child(7n + 5) {margin:0 0 2.5%;}
  ul.recipe_all > li:nth-child(7n + 6) {float:right;margin:-25% 34.166% 0 0;}
  ul.recipe_all > li:nth-child(7n + 7) {float:right;margin:-25% 68.7223% 0 0;}
  
  ul.recipe_all > li:nth-child(7n + 1) ,
  ul.recipe_all > li:nth-child(7n + 5) {padding:47.5% 0 0;}
  
  ul.recipe_all > li figure {
    position:absolute;
    top:0;
    left:0;
    z-index:0;
    width:61.84%;
    height:100%;
    margin:0;
    overflow:hidden;
  }
  
  ul.recipe_all > li:nth-child(7n + 1) figure ,
  ul.recipe_all > li:nth-child(7n + 5) figure {width:100%;height:0;padding:94.73% 0 0;}
  
  ul.recipe_all > li figure img {
    display:block;
    position:absolute;
    margin:auto;
    top:-100%;
    bottom:-100%;
    left:-100%;
    right:-100%;
    height:100%;
  }
  
  ul.recipe_all > li:nth-child(7n + 1) figure img ,
  ul.recipe_all > li:nth-child(7n + 5) figure img{width:100%;height:auto;}
  
  ul.recipe_all > li dl {
    position:absolute;
    top:0;
    right:0;
    z-index:1;
    width:38.16%;
    height:100%;
  }
  
  ul.recipe_all > li:nth-child(7n + 1) dl ,
  ul.recipe_all > li:nth-child(7n + 5) dl {
    width:100%;
    height:36.84%;
    top:auto;
    bottom:0;
  }
  
  ul.recipe_all > li dl::before {
    position:absolute;
    display:block;
    content:"";
    width:0;
    height:0;
    border-right:solid 1.6em #f5faf0;
    border-top:solid 1em transparent;
    border-bottom:solid 1em transparent;
    top:2em;
    left:-1.4em;
  }
  
  ul.recipe_all > li:nth-child(7n + 1) dl::before ,
  ul.recipe_all > li:nth-child(7n + 5) dl::before {
    position:absolute;
    display:block;
    content:"";
    width:0;
    height:0;
    border-bottom:solid 1.6em #f5faf0;
    border-left:solid 1em transparent;
    border-right:solid 1em transparent;
    top:-2.4em;
    left:2em;
  }
  
  ul.recipe_all > li dl dt {
    width:90%;
    /*font-size:1.3em;*/
    font-size:16px;
    font-weight:bold;
    margin:1em 5% 0.5em;
  }
  
  ul.recipe_all > li:nth-child(7n + 1) dl dt,
  ul.recipe_all > li:nth-child(7n + 5) dl dt {
    width:70%;
  }

 ul.recipe_all > li dl dd {
    width:90%;
    margin:0 5% 5%;
  }
  
 ul.recipe_all > li:nth-child(7n + 1) dl dd,
 ul.recipe_all > li:nth-child(7n + 5) dl dd {
    width:70%;
    margin:0 5%;
  }
  
 ul.recipe_all > li dl dd:last-child {
   position:absolute;
   width:auto;
   bottom:5px;
   right:5px;
   margin:0;
 }
  
  ul.recipe_all > li dl dd ul {height:1.6em;}
  
  ul.recipe_all > li dl dd:last-child ul li {
    display:inline-block;
    /*width:2em;
    height:2em;*/
    width:1.6em;
    height:1.6em;
    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::before {border-right:solid 1.6em #f7e9f2;}
  ul.r_cold > li dl::before {border-right:solid 1.6em #ecf2fa;}
  ul.st_jp > li dl::before {border-right:solid 1.6em #f5faf0;}
  ul.st_ws > li dl::before {border-right:solid 1.6em #fff0eb;}
  ul.st_ch > li dl::before {border-right:solid 1.6em #faf0d7;}
  ul.r_sp > li dl::before {border-right:solid 1.6em #eee6da;}
  
  ul.r_hot > li:nth-child(7n + 1) dl::before ,ul.r_hot > li:nth-child(7n + 5) dl::before {border-bottom:solid 1.6em #f7e9f2;border-left:solid 1em transparent;}
  ul.r_cold > li:nth-child(7n + 1) dl::before ,ul.r_cold > li:nth-child(7n + 5) dl::before {border-bottom:solid 1.6em #ecf2fa;border-left:solid 1em transparent;} 
  ul.st_jp > li:nth-child(7n + 1) dl::before ,ul.st_jp > li:nth-child(7n + 5) dl::before {border-bottom:solid 1.6em #f5faf0;border-left:solid 1em transparent;} 
  ul.st_ws > li:nth-child(7n + 1) dl::before ,ul.st_ws > li:nth-child(7n + 5) dl::before {border-bottom:solid 1.6em #fff0eb;border-left:solid 1em transparent;}
  ul.st_ch > li:nth-child(7n + 1) dl::before ,ul.st_ch > li:nth-child(7n + 5) dl::before {border-bottom:solid 1.6em #faf0d7;border-left:solid 1em transparent;}
  ul.r_sp > li:nth-child(7n + 1) dl::before ,ul.r_sp > li:nth-child(7n + 5) dl::before {border-bottom:solid 1.6em #eee6da;border-left:solid 1em transparent;} 
  
  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 40px;
  }
  
  ul.cat_recipe li {
    width:48%;
    height:auto;
    margin:0 4% 0 0;
    float:left;
    font-family: "ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
    transition:0.5s;
    opacity:1;
  }
  
  ul.cat_recipe li:hover {opacity:0.6;transition:0.5s;}
  ul.cat_recipe li img {display:block;width:58%;}
  ul.cat_recipe li:nth-child(even) {margin:0;}
  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;
  }
  
  ul.cat_recipe  li.st_ch p {padding:7% 0 0;}
  ul.cat_recipe li:nth-child(even) p {float:right;}
  
  /**** レシピ個別 ****/ 
  
  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:30px;
    margin:0 auto 50px;
    padding:0 0 10px;
    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:25px;
    float:right;
  }
  
  div.recipe_single h1 span:nth-of-type(2)::before {display:inline-block;width:62px;height:20px;content:"";background:url(./img/recipe/r_before.png) no-repeat left center;margin:0 10px 0 0;}
  div.recipe_single h1 span:nth-of-type(2)::after {display:inline-block;width:62px;height:20px;content:"";background:url(./img/recipe/r_after.png) no-repeat right center;margin:0 0 0 10px;}
  
  div.recipe_single > figure {width:54%;float:left;margin:0 0 50px;}
  div.recipe_detail {width:40%;float:right;margin:0 0 50px;}
  div.recipe_detail p {width:70%;float:left;}
  div.recipe_detail p.qrc {width:30%;float:right;text-align:center;font-size:10px;}
  div.recipe_detail p.qrc img {max-width:80px;}
  div.recipe_detail dl {
    width:100%;
    clear:both;
    overflow:hidden;
    margin:0 auto 30px;
    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:5px 0 5px 0.5em;
  }
  
  div.recipe_detail dl dd {
    box-sizing:border-box;
    width:60%;
    font-size:18px;
    color:#714988;
    font-weight:bold;
    float:left;
    border-top:solid 1px #c8c8c8;
    text-align:right;
    padding:5px 0.5em 5px 0;
  }
  
  div.recipe_detail dl dd span {
    font-size:12px;
    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 25px;
  }
  
  div.recipe_detail ul li {
    box-sizing:border-box;
    display:block;
    width:12.5%;
    height:40px;
    float:left;
    padding:1.2% 2.5%;
    border-left:solid 1px #c8c8c8;
  }
  div.recipe_detail ul li img {
    vertical-align:middle;
  }
  
  div.recipe_detail ul li:nth-child(3) {
    width:37.5%;
    padding:0 2.5%;
  }
  
  div.recipe_detail ul li:nth-child(4) {
    width:37.5%;
    padding:0 0 0 10%;
    text-align:right;
  }
  
  div.recipe_detail p.product_this {
    width:100%;
    font-size:18px;
    font-weight:bold;
    text-align:center;
    color:#714988;
    margin:0 auto 10px;
  }
  
  div.recipe_detail p.product_this + div {
    width:100%;
    height:auto;
    overflow:hidden;
    background:#ebe5ee;
    padding:3%;
  }
  
  div.recipe_detail p.product_this + div img {width:42%;float:left;}
  div.recipe_detail p.product_this + div p {width:55%;float:left;}
  div.recipe_detail p.product_this + div p:nth-of-type(1) {font-size:20px;font-weight:bold;margin:5px 0;}
  div.recipe_detail p.product_this + div p.detail_link {font-size:15px;background:#FFF;width:8em;float:none;clear:both;}
  
  section.recipe_single h2 {
    width:100%;
    height:auto;
    line-height:1.3em;
    font-size:22px;
    margin:0 auto 5px;
    padding:0 0 5px;
    border-bottom:solid 2px #714988;
    overflow:hidden;
  }
  
  section.material {width:40%;float:left;clear:both;margin:0 auto 50px;} 
  section.cookflow {width:55%;float:right;margin:0 auto 50px;} 
  
  section.material dl {
    width:100%;
    clear:both;
    overflow:hidden;
    margin:0 auto ;
    font-size:17px;
    padding:10px 0 0;
  }
  
  section.material dl dt {
    box-sizing:border-box;
    width:70%;
    float:left;
    border-top:solid 1px #c8c8c8;
    padding:10px 0 0 0.5em;
    min-height:38px;
  }
  
  section.material dd {
    box-sizing:border-box;
    width:30%;
    float:left;
    border-top:solid 1px #c8c8c8;
    text-align:right;
    padding:10px 0.5em 0 0;
    min-height:38px;
  }
  
  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.cookflow ol {width:100%;}
  section.cookflow ol li {
    position:relative;
    width:85%;
    height:auto;
    padding:1em 0 1em 15%;
    border-bottom:solid 1px #c8c8c8;
    font-size:17px;
  }
  
  section.cookflow ol li::before {
    box-sizing:border-box;
    position:absolute;
    display:block;
    margin:auto;
    top:0;
    bottom:0;
    left:5%;
    font-size:1.8em;
    width:1.2em;
    height:1.2em;
    padding:0.15em 0 0;
    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 50px;
  }
  
  div.recomend_product > img {width:18%;margin:0 2% 0 0;float:left;}
  div.recomend_product > div {width:80%;float:left;}
  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:22px;
    margin:0 0 10px;
  }
  
  div.recomend_product > div > p:nth-of-type(1) span {color:#714988;}
  div.recomend_product > div > p:nth-of-type(2) {width:50%;font-size:14px;float:left;margin:0;}
  
  div.recomend_product > div > div {width:45%;float:right;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 5px;}
  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 ;}
  div.recomend_product > div div.to_cart span {float:left;margin:20px 0 0;}
  div.recomend_product > div > div select {float:left;margin:20px 5px 0 0;}
  div.recomend_product > div > div p.to_cart {width:85%;float:left;max-width:240px;margin:0;}
  div.recomend_product > div > div p.to_cart input {width:100%;height:auto;}

  section.recomend h2 {margin:0 0 30px;}
  section.recomend ul {width:100%;margin:0 auto 60px;overflow:hidden;}
  section.recomend ul li {width:18.8%;float:left;margin:0 1.5% 0 0;}
  section.recomend ul li:last-child {margin:0;}
  section.recomend ul li p {line-height:1.4em;font-weight:bold;}
  div.recipe_single div.bottom_box {text-align:center;}
  div.recipe_single p.common_link {
    display:inline-block;
    font-family: "ヒラギノ明朝 ProN W6", "HiraMinProN-W6","游明朝",YuMincho,"Yu Mincho","HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
    margin:0 20px;
  }
  
  
  /** ギフトカテゴリー **/
  
  main article.gift_category .box {width:100%;}
  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 center / 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:17px;
    width:700px;
    margin:0 auto 60px;
  }
  ul.gift_list {
    width:900px;
    margin:0 auto 100px;
    overflow:hidden;
  }
  ul.gift_list li {
    width:100%;
    margin:0 auto 30px;
  }
  /*ul.gift_list li:nth-child(5) ,*/
  ul.gift_list li:nth-child(7) ,
  ul.gift_list li:nth-child(9) ,
  ul.gift_list li:nth-child(11),
  ul.gift_list li:nth-child(13) {
    width:420px;
    float:right;
    
  }
  ul.gift_list li:nth-child(6) ,
  ul.gift_list li:nth-child(8) ,
  ul.gift_list li:nth-child(10) ,
  ul.gift_list li:nth-child(12) {
    width:420px;
    float:left;
    clear:both;
  }
  ul.gift_list li a {
    opacity:1;
    transition:0.5s;
    font-size:16px;
  }
  ul.gift_list li a:hover {
    text-decoration:underline;
    opacity:0.6;
  }
  section.gift_head {
    width:700px;
    margin:0 auto 60px;
  }
  section.gift_head h2 {
    font-size:44px;
    font-weight:bold;
    line-height:1.5;
    color:#da7482;
    text-align:center;
    margin:0 auto 20px;
    letter-spacing:0.05em;
  }
  .gift_blue section.gift_head h2 {color:#677fc4;}
  section.gift_head .button_gift {
    width:230px;
    height:60px;
    line-height:60px;
    font-size:16px;
    text-align:center;
    margin:0 auto 80px;
  }
  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:30px;
    line-height:1.5;
    margin:0 auto 30px;
    color:#da7482;
    font-weight:bold;
    clear:both;
  }
  .gift_blue section.gift_head h3  {color:#677fc4;}
  section.gift_head p {font-size:17px;}
  section.gift_head p.right {
    width:100%;
    text-align:right;
    margin:0 0 50px;
  }
  section.gift {
    width:720px;
    margin:0 auto 100px;
  }
  section.gift h2 {
    font-size:36px;
    text-align:center;
    margin:0 auto 40px;
    line-height:1.5;
    color:#da7482;
    font-weight:bold;
  }
  .gift_blue section.gift h2 {color:#677fc4;}
  section.gift p {font-size:17px;}
  section.gift ul {
    width:630px;
    margin:0 auto;
    overflow:hidden;
  }
  section.gift ul li {
    width:300px;
    margin:0 0 30px;
    float:left;
  }
  section.gift ul li:nth-child(even) {float:right;}
  section.gift ul li img {display:block;}
  section.gift_recipe figure {
    width:400px;
    float:left;
    margin:0 30px 30px 0;
  }
  section.gift_recipe h3 {
    font-size:30px;
    color:#da7482;
    margin:10px 0 20px;
  }
  .gift_blue section.gift_recipe h3 {color:#677fc4;}
  section.gift_recipe figure + p + h3 {
    width:290px;
    float:right;
    margin:40px 0 20px;
  }
  section.gift_recipe figure + p {
    width:290px;
    float:right;
    margin:0;
  }
  section.gift_recipe ul {
    width:290px;
    float:right;
    margin:0;
  }
  section.gift_recipe ul:nth-of-type(2) {margin:0 0 30px;}
  section.gift_recipe ul li {
    float:none!important;
    font-size:17px;
    margin:0 0 5px;
  }
  .gift_category h2.h2_mark {color:#714987;}
  section.gift_ranking {
    margin:0 auto 100px;
  }
  section.gift_ranking ul {overflow:hidden;}  
  section.gift_ranking ul li {
    width:30%;
    margin:0 5% 0 0;
    float:left;
  }  
  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:65px;
    height:117px;
    content:"";
    top:0;
    left:0;
    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:30px;
    font-weight:bold;
    line-height:1.2;
    color:#714987;
    margin:0 0 10px;
  }
  section.gift_ranking ul li dl dd p.ranking_content {
    box-sizing:border-box;
    width:100%;
    height:50px;
    line-height:50px;
    font-size:15px;
    padding:0 1em;
    background:#eeeeee;
  }
  section.gift_ranking ul li dl dd p.price_tax {font-size:18px;}
  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 {display:none;}
  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;
    font-size:16px;
    margin:0 0 0 0.5em;
  }
  section.gift_ranking ul li .ranking_link {
    width:170px;
    height:35px;
    line-height:35px;
    text-align:center;
    margin:20px auto;
    font-size:16px;
  }
  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;}
  .gift_category .product_banner + div.clear {margin:100px auto;}
  .gift_category .center_lead {
    font-size:30px;
    font-weight:bold;
    text-align:center;
    margin:30px auto 80px;
  }
  section.gift_reason {
    width:700px;
    margin:0 auto 100px;
  }
  section.gift_reason h2 {
    font-size:36px;
    text-align:center;
    margin:0 auto 40px;
    line-height:1.5;
    color:#714987;
    font-weight:bold;
  }
  section.gift_reason dl dt {
    position:relative;
    width:100%;
    height:55px;
  }
  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 {
    display:inline-block;
    padding:0 10px 0 0;
    background:#FFFFFF;
    position:absolute;
    top:0;
    left:0;
    z-index:1;
  }
  section.gift_reason dl dd {
    width:100%;
    padding:20px 0 30px;
    margin:0 0 30px;
    text-align:center;
    font-size:27px;
    font-weight:bold;
    border-bottom:solid 1px #714987;
  } 
  section.gift_reason + ul {
    overflow:hidden;
    margin:0 auto 80px;
  }
  section.gift_reason + ul li {
    width:32%;
    float:left;
    margin:0 2% 0 0;
  }
  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 35px;
    font-size:38px;
    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: 16px;}
  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 100px;}
  .order_sheet section[id^="order_"] {
    padding:200px 0 0;
    margin:-200px auto 100px;
  }
  .order_sheet section[id^="order_"] ol {
    width:100%;
    margin:auto;
    overflow:hidden;
  }
  .order_sheet section[id^="order_"] ol li {
    width:32%;
    float:left;
    margin:0 2% 0 0;
  }
  .order_sheet section[id^="order_"] ol li:nth-child(3) {margin:0;}
  .order_sheet section[id^="order_"] ol li img {
    display:block;
    width:100%;
  }
  .order_sheet section[id^="order_"] ol li p {
    position:relative;
    margin:10px 0 0;
    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: 28px;
    color: #714987;
    font-weight: bold;
  }
  .order_sheet section[id^="order_"] .index_menu{margin: 0 0 65px;}
  .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: -38px;
  }
  .order_sheet section[id^="order_"] .destination a{
    font-size: 40px;
    font-weight: bold;
    text-decoration: underline;
  }
  .order_sheet section[id^="order_"] .destination img{
    position: relative;
    left: 10px;
    width: 450px;
  }
  .order_sheet section.how_sheet{margin: 0 0 7em;}
  .order_sheet section.how_sheet h2 {
    font-size: 24px;
    text-align: center;
    margin: 0 0 1em;
    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: 28px; 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: 760px;
    margin: auto;
  }
  .order_sheet section.how_sheet ol.sheet_flow li{
    position: relative;
    font-size: 17px;
    padding: 0 0 0 3.5em;
    margin: 0 0 4em;
  }
  .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: 35px;
    height: 35px;
    line-height: 38px;
    color: #4189C5;
    font-size: 24px;
    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: 24px;
    font-weight: bold;
  }
  .order_sheet section.how_sheet ol.sheet_flow li.if {
    font-size: 28px;
    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: 28px;
    font-weight: bold;
    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;}
}
  

@media print {
header ,
aside,
nav,
div.bottom_content,
footer {display:none;}
  main {padding:0;}
}