@charset "UTF-8";
/*-------------------------
CPバナー
-------------------------*/
.cp_bnr {
    width:864px;
    margin: 8% auto;
}
.cp_bnr ul {
    display: flex;
    justify-content: center;
}
.cp_bnr li {
    flex-basis: 411px;
}
.cp_bnr li:nth-of-type(even) {
    margin-left: 24px;
}
.cp_bnr li img {
    max-width: 100%;
    height: auto;
}



/*-------------------------
商品詳細 共通
-------------------------*/
.product_pageContents {
  width: 750px;
  margin: 0 auto;
  font-family: "A1ゴシック L";
}
.product_pageContents > div {
  margin: 0 4%;
}
.product_pageContents > div + div {
  margin-top: 6%;
}
.product_pageContents .img {
  text-align: center;
}
.product_pageContents .img + .img {
  margin-top: 4%!important;
}
.product_pageContents img {
  max-width: 750px;
  width: 100%;
  vertical-align: bottom;
}
.product_pageContents h3 {
  margin: 5.79% 0 4%;
  font-size: 18px;
  font-family: "A1ゴシック R";
    line-height: 1.6;
}
.product_pageContents h4 {
  margin: 5.79% 0;
  font-size: 15px;
  font-family: "A1ゴシック R";
  line-height: 1.8;
}
.product_pageContents p {
  margin: 4.34% 0;
    font-size: 15px;
  line-height: 1.8;
}
.product_pageContents a{
}
.product_pageContents a:link{
  text-decoration: underline;
}
.product_pageContents a:hover{
  text-decoration: underline;
}
.product_pageContents a:active{
  text-decoration: underline;
}
.product_pageContents a:visited{
  text-decoration: underline;
}
.product_pageContents strong {
  font-family: "A1ゴシック R";
}
.product_pageContents .caution {
  font-size: 12px;
}
.product_pageContents sup {
  font-size: 10px;
  position: relative;
  top: -5px;
}
.product_pageContents small {
  font-size: 10px;
}
.product_pageContents .img-icon-float-left-top {
  width: 120px;
  float: left;
  margin-right: 4%;
  margin-bottom: 4%;
}

.product_pageContents .cf:after {
	content: "";
	display: block;
	clear: both;
}
.product_pageContents .sp_only {
	display: none;
}
.product_pageContents .ff_price {
    font-family: "秀英角ゴシック金 B","Shuei KakuGo Kin B", sans-serif;
}
.product_pageContents .tar {
    text-align: right;
}
.product_pageContents .tac {
    text-align: center;
}

/*-------------------------
アコーディオン
-------------------------*/
.product_pageContents .toggle_btn {
  position: relative;
  display: block;
}
.product_pageContents .toggle_btn:hover {
  cursor: pointer;
}
.product_pageContents .toggle_btn h3 {
  position: relative;
  margin: 4% 0;
}
.product_pageContents .toggle_btn span {
  position: absolute;
  height: 1px;
  background-color: #767676;
  right: 0;
  top: 50%;
  transition: 0.3s;
  width: 25px;
}
.product_pageContents .toggle_btn span:nth-of-type(1) {
  transform: rotate(0deg);
  -webkit-transform: rotate(0deg);
  -moz-transform: rotate(0deg);
  -ms-transform: rotate(0deg);
  -o-transform: rotate(0deg);
}
.product_pageContents .toggle_btn span:nth-of-type(2) {
  transform: rotate(90deg);
  -webkit-transform: rotate(90deg);
  -moz-transform: rotate(90deg);
  -ms-transform: rotate(90deg);
  -o-transform: rotate(90deg);
}
.product_pageContents .toggle_btn .active span:nth-of-type(1) {}
.product_pageContents .toggle_btn .active span:nth-of-type(2) {
  transform: rotate(180deg);
  -webkit-transform: rotate(180deg);
  -moz-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  -o-transform: rotate(180deg);
}
/*-------------------------
商品について 共通
-------------------------*/
.product_pageContents .about_product .img:not(:first-child) {
  width: 70%;
  margin: 8% auto;
}
/*-------------------------
枠あり　共通
-------------------------*/
.product_pageContents .frame_box {
  position: relative;
  margin-top: 12%;
  border: solid 1px #b2b2b2;
  padding: 4%;
  padding: 2% 4% 2% 4%;
}
.product_pageContents .frame_box h4 {
  margin: 4% 0;
}
.product_pageContents .frame_box .img {
  width: 70%;
  margin: 0 auto 4%;
}
.product_pageContents .deals_box .img {
    width:58%;
}
/*----コラム-------------*/
.product_pageContents .column .column_subtitle {
  position: absolute;
  top: -13px;
}
.product_pageContents .column .column_subtitle span {
  font-size: 15px;
  background-color: #ffffff;
  padding: 15%;
}

/*----中の人の声-------------*/

.product_pageContents .frame_box .insider-prof{
  display: flex;
  -webkit-align-items: flex-end;
          align-items: flex-end;
  -webkit-justify-content: space-between;
          justify-content: space-between;
margin-bottom: 4%;
}
.product_pageContents .frame_box .insider-prof_name{
  flex-basis: 70%;
  text-align: right;
  padding: 0 2% 0 0;
  margin: 0;
}
.product_pageContents .frame_box .insider-prof_ph{
  flex-basis: 30%;
  padding: 0;
  margin: 0;
}

.product_pageContents .contents_bnr .img{
    width:64%;
    margin: 8% auto;
}

/*-------------------------
動画
-------------------------*/
.product_pageContents .movie_box {
  margin-top: 8%;
}
.product_pageContents .movie {
/*  width: 660px;
  margin: 0 auto;*/
}
.product_pageContents .movie iframe {
    width:100%;
  height: 390px;
}
/*-------------------------
素材
-------------------------*/
.product_pageContents .material h4 {
  margin-bottom: 35px;
}
.product_pageContents .material .material_box {
  display: flex;
  margin-bottom: 50px;
}
.product_pageContents .material .material_box .img {
  flex-basis: 30%;
}
.product_pageContents .material .material_box .img img {
  width: 200px;
}
.product_pageContents .material .material_box .txt {
  flex-basis: 70%;
  padding-left: 20px;
  box-sizing: border-box;
}
.product_pageContents .material .material_box .txt span {
    font-size: 15px;
  font-family: "A1ゴシック R";
}
.product_pageContents .material .material_box .txt p {
  margin-top: 0;
}

.product_pageContents .material .material_oil {
    display: block;
}
.product_pageContents .material .material_oil > ul {
    margin-bottom: 4.34%;
}
.product_pageContents .material .material_oil > ul li:nth-of-type(1),
.product_pageContents .material .material_oil > ul li:nth-of-type(2) {
    margin-bottom: 15px;
}
.product_pageContents .material .material_oil > .txt {
    padding-left: 0;
}
.product_pageContents .material .material_oil > .txt span {
    line-height: 1.7;
}
.product_pageContents .material .material_oil > .txt > p {
    margin-bottom: 2.17%;
}
.product_pageContents .material .material_oil ul {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}
.product_pageContents .material .material_oil li {
    flex-basis: 50%;
     display: flex;
}
.product_pageContents .material .material_oil ul li .img,
.product_pageContents .material .material_oil ul li .txt{
    flex-basis:47.8%;
}
.product_pageContents .material .material_oil ul li .txt {
    padding-left: 15px;
}
.product_pageContents .material .material_oil ul li .img img {
    width:165px;
}
.product_pageContents .material .material_oil ul li .txt span {
  font-family: "A1ゴシック L";
    font-size: 13px;
}


/*-------------------------
使い方
-------------------------*/
.product_pageContents .howto {
  margin-top: 135px;
  border-top: 1px solid #b2b2b2;
}
.product_pageContents .howto_box {
  margin-bottom: 120px;
}
.product_pageContents .howto_box > div {
    padding: 45px 60px;
}
.product_pageContents .howto_box > div >h4 {
    margin-top: 0;
}
/*----step-----------------*/
.product_pageContents .howto .howto_step {
  
}
.product_pageContents .howto .howto_step span {
  text-align: center;
  margin: 2% 0 0;
  display: block; font-size: 15px;
}
.product_pageContents .howto .howto_step .howto_step_box {
  text-align: center;
  border: 1px solid #b2b2b2;
/*  margin: 0 auto 4%;*/
    margin: 0 auto;
  width: 365px;
}
.product_pageContents .howto .howto_step .flex_box {
   display: flex;
  justify-content: center;
  align-items: center;
}
.product_pageContents .howto .howto_step .flex_box p {
  margin: 0;
  height: 50px;
  line-height: 50px;
}
.product_pageContents .howto .howto_step .flex_box .f-red {
  color: #b8193f;
}
.product_pageContents .howto .howto_step .flex_box .img {
  display: inline-block;
  margin: 0 2.5vw;
  position: relative;
}
.product_pageContents .howto .howto_step .flex_box .img:first-of-type {
    margin: 0 2.5rem 0 1rem;
}
.product_pageContents .howto .howto_step .flex_box .img:last-of-type {
    margin: 0 1rem 0 2.5rem;
}
.product_pageContents .howto .howto_step .flex_box .img .i-sun {
  width: 29px;
}
.product_pageContents .howto .howto_step .flex_box .img .i-moon {
  width: 20px;

}
.product_pageContents .howto .howto_step .howto_step_box p {
    margin: 0;
}
.product_pageContents .howto .howto_step .howto_step_box p a {
  display: block;
  text-align: center;
  line-height: 50px;
  text-decoration: none;
}
.product_pageContents .howto .howto_step .img .arrow {
  width: 47px;
  margin: 4% 0;
}
.product_pageContents .howto .howto_step .howto_step_txt {
    margin-bottom: 2%;
}

/*----use-----------------*/
.product_pageContents .howto .howto_use strong {
    font-size: 15px;
}
.product_pageContents .howto .howto_use .howto_use_box {
  display: flex;
  margin-top: 2%;
  justify-content: space-between;
}
.product_pageContents .howto .howto_use .howto_use_box-1cal {
  margin-top: 2%;
}
.howto_use_box + strong,
.howto_use_box-1cal + strong {
  display: block;
  margin-top: 6%;
}
.product_pageContents .howto .howto_use .howto_use_box .img {
  flex-basis: 47%;
  text-align: right;
}
.product_pageContents .howto .howto_use .howto_use_box .img img {
  width: 217px;
}
.product_pageContents .howto .howto_use .howto_use_box .txt {
  /*flex-basis: 47%;*/
    flex-basis: 53%;
}
.product_pageContents .howto .howto_use .howto_use_box .txt p {
  margin: 0;
}
.product_pageContents .howto .howto_use .arrow {
  width: 47px;
  margin: 5% 0;
}

/*----Point-----------------*/
.product_pageContents .howto .howto_use_point {
  position: relative;
  border: 1px solid #b2b2b2;
  margin-top: 20px;
   padding: 25px 30px;
}
.product_pageContents .howto .howto_use_point span {
  position: absolute;
    font-size: 15px;
  background-color: #ffffff;
  padding: 0 2%;
  top: -10px;
  left: 15px;
}
.product_pageContents .howto .howto_use_point p {
  margin: 0;
}
.product_pageContents .howto .howto_use_point p + .img{
  margin: 4.34% auto 0;
  width: 70%;
}
.product_pageContents .howto .howto_use_point .img + .img{
  margin: 4.34% auto 0;
  width: 70%;
}
.product_pageContents .howto .howto_use_point_col2 {
    display: flex;
    justify-content: space-between;
}
.product_pageContents .howto .howto_use_point_col2 .txt {
    flex-basis: 53.2%;
}
.product_pageContents .howto .howto_use_point_col2 .img {
    flex-basis: 40%;
}

/*----応用-----------------*/
.product_pageContents .ouyou {
  position: relative;
  margin-top: 90px;
  border: 1px solid #b2b2b2;
  padding: 4%;
  width: 570px;
  margin: 90px auto 0;
}
.product_pageContents .ouyou h3 {
  position: absolute;
  background-color: #ffffff;
  padding: 0 2%;
  top: -45px;
  left: 25px;
  font-size: 15px;
}
.product_pageContents .ouyou .ouyou_box {
  display: flex;
}
.product_pageContents .ouyou strong {
    font-size: 15px;
  margin: 25px 0;
  display: block;
}
.product_pageContents .ouyou .ouyou_box {
  display: flex;
  justify-content: space-between;
  margin-bottom: 5%;
}
.product_pageContents .ouyou .ouyou_box .txt {
  flex-basis: 63%;
}
.product_pageContents .ouyou .ouyou_box .txt p {
  margin: 0;
}
.product_pageContents .ouyou .ouyou_box .img {
  flex-basis: 35%;
}
.product_pageContents .ouyou .ouyou_box .img img {
  width: 150px;
}
.product_pageContents .ouyou .ouyou_box-1cal {
  display: block;
  margin-bottom: 5%;
}
.product_pageContents .ouyou .ouyou_box-1cal .txt {
}
.product_pageContents .ouyou .ouyou_box-1cal .img {
}
.product_pageContents .ouyou .ouyou_box-1cal .img img{
  width: 70%;
}
/*-------------------------
成分
-------------------------*/
.product_pageContents .seibun {
  border-top: 1px solid #b2b2b2;
  margin-top: 0;
}
.product_pageContents .seibun_box {
  padding: 45px 60px;
}
.product_pageContents .seibun table {
  width: 570px;
    font-size: 13px;
  margin: 0 auto;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  border-collapse: collapse;
  border-spacing: 0;
  border-top: 1px solid #dedede;
  border-left: 1px solid #dedede;
}
.product_pageContents .seibun table tr th, .product_pageContents .seibun table tr td {
  border-right: 1px solid #dedede;
  border-bottom: 1px solid #dedede;
  padding: 1.9% 1%;
     width:50%;
}
.product_pageContents .seibun table .ttl th {
  border-right: 1px dotted #ffffff;
  background-color: #dedede;
  text-align: center;
}
.product_pageContents .seibun table .ttl td {
  background-color: #dedede;
  text-align: center;
  border-right: 1px dotted #dedede;
}
/*-------------------------
注釈
-------------------------*/
.product_pageContents .product_caution {
  border-top: 1px solid #b2b2b2;
  padding-top: 6%;
  margin-top: 0;
}
.product_pageContents .product_caution p {
  font-size: 12px;
  margin: 0;
  letter-spacing: -0.05em;
}
/*-------------------------
SDGs 2020/11追加
-------------------------*/
.product_pageContents .sdgs .column_subtitle {
    background: #fff;
    padding:0 2%;
}
.product_pageContents .sdgs .column_subtitle span {
    padding: 0;
}
.product_pageContents .sdgs h3 {
     font-size: 15px;    
}
/*-------------------------
商品詳細オリーブオイル 2020/12/11追加
-------------------------*/
.product_pageContents .marker {
    background: linear-gradient(rgba(255, 255, 255, 0) 40%, #f8ffa9 60%);
}
.product_pageContents .list_deci_olive {
	padding-left: 1.3em;
    list-style: decimal;	
}
/*-------------------------
商品詳細オリーブオイル 2020/12/22追加
-------------------------*/
.product_pageContents .oliveoil_page_banner {
    width: 80%;
    display: flex;
    margin: 10% auto 0;
    border: 1px solid #e2e2e2;
    align-items: center;
    text-decoration: none !important;
}
.product_pageContents .oliveoil_page_banner img {
    display: block;
    width: 38%;
}
.product_pageContents .oliveoil_page_banner p {
    text-align: center;
    font-size: 1.4rem;
    width: 62%;
}
.product_pageContents .oliveoil_page_banner p span {
    text-decoration: underline;
}
/*-------------------------
商品詳細オイル雪 2021/1/7追加
-------------------------*/
.product_pageContents .about_product h3 .sub {
    font-size: 1.4rem;display: block;margin-top: 0.5rem;
}
.product_pageContents .column h4 .sub {
    font-size: 1.3rem;display: block;margin-bottom: 1rem;text-decoration: underline;
}
/*-------------------------
商品詳細オイル10ｍL 2021/1/14追加
-------------------------*/
.product_pageContents .deals_box .deals_list {
  list-style:disc;
  margin-left:2rem;
  margin-bottom:2rem
}
.product_pageContents .deals_box .deals_list li {
  margin-top:0.5rem;
}
.product_pageContents .deals_box .img_m{
    width:52%;
    margin: 0 auto 4%;
}
/*-------------------------
商品詳細カレンダー2022 2021/8/27追加
-------------------------*/
.product_pageContents .ph_caption {
    font-size: 1.3rem;
    text-align: left;
    display: block;
}
.product_pageContents dl.collaboration {
    font-size: 1.3rem;
}
.product_pageContents dl.collaboration dt {
    text-align: center;
}
.product_pageContents dl.collaboration dd {
    margin-top: 1em;
    display: flex;
    justify-content: space-;
}
.product_pageContents .contents_bnr.zayouzen_bnr .img{
    width: 70%;
}