@charset "utf-8";

/* Product Details Setting
***********************/
.recipesDetailsArea
{ position:relative; }

.recipesDetailsArea .visualArea
{ height:400px; background-position:center center; background-repeat:no-repeat; background-size:cover; margin-bottom:25px; -webkit-box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.2); -moz-box-shadow:0px 0px 10px 0px rgba(0, 0, 0, 0.2); box-shadow:0px 0px 10px 0px rgba(0, 0, 0, 0.2);}
.recipesDetailsArea .visualArea .visualInner
{ background:rgba(0,0,0,.4); display:none;}
.recipesDetailsArea .visualArea .visualInner .tit
{ color:#fff; margin-bottom:20px;}
.recipesDetailsArea .visualArea .visualInner .ratingRow
{ position:relative; width:110px; margin:0px auto; margin-bottom:30px;}
.recipesDetailsArea .visualArea .visualInner .ratingRow .starOff
{ position:relative; width:110px; }
.recipesDetailsArea .visualArea .visualInner .ratingRow span
{ margin:0px 1px;}
.recipesDetailsArea .visualArea .visualInner .ratingRow span img
{ width:20px; height:auto;}
.recipesDetailsArea .visualArea .visualInner .ratingRow .starOn
{ position:absolute; overflow:hidden; z-index:1;}
.recipesDetailsArea .visualArea .visualInner .ratingRow .starOn.rating00_5
{ width:10%;}
.recipesDetailsArea .visualArea .visualInner .ratingRow .starOn.rating01
{ width:20%;}
.recipesDetailsArea .visualArea .visualInner .ratingRow .starOn.rating01_5
{ width:30%;}
.recipesDetailsArea .visualArea .visualInner .ratingRow .starOn.rating02
{ width:40%;}
.recipesDetailsArea .visualArea .visualInner .ratingRow .starOn.rating02_5
{ width:50%;}
.recipesDetailsArea .visualArea .visualInner .ratingRow .starOn.rating03
{ width:60%;}
.recipesDetailsArea .visualArea .visualInner .ratingRow .starOn.rating03_5
{ width:70%;}
.recipesDetailsArea .visualArea .visualInner .ratingRow .starOn.rating04
{ width:80%;}
.recipesDetailsArea .visualArea .visualInner .ratingRow .starOn.rating04_5
{ width:90%;}
.recipesDetailsArea .visualArea .visualInner .ratingRow .starOn.rating05
{ width:100%;}
.recipesDetailsArea .visualArea .visualInner .ratingRow .starOn .starOnInner
{ width:110px;}

.recipesDetailsArea .visualArea .descArea
{ padding:20px;}
.recipesDetailsArea .visualArea .descArea .creatorRow
{ font-size:16px; line-height:1.3; color:#fff; margin-bottom:25px;}
.recipesDetailsArea .visualArea .descArea p
{ font-size:16px; line-height:1.5; color:#fff; width:50%; margin:0px auto; margin-bottom:25px;}

.recipesDetailsArea .visualArea .descArea .relatedTagRow
{ text-align:center;}
.recipesDetailsArea .visualArea .descArea .relatedTagRow a
{ display:inline-block; padding:10px 20px; white-space:nowrap; color:#36322d; font-size:15px; line-height:1; background:#dddddd; margin-bottom:10px;}
.recipesDetailsArea .visualArea .descArea .relatedTagRow a:hover
{ color:#fff; background:#acb500;}


.recipesDetailsArea .socialActionRow
{ width:90%; margin:0px auto; text-align:center; margin-bottom:35px;}
.recipesDetailsArea .socialActionRow a
{ font-size:24px; line-height:1.5; color:#747474; margin:0px 2%; white-space:nowrap;} 
.recipesDetailsArea .socialActionRow a:hover
{ color:#acb500;} 
.recipesDetailsArea .socialActionRow a:hover .svg path,
.recipesDetailsArea .socialActionRow a:hover .svg rect,
.recipesDetailsArea .socialActionRow a:hover .svg polygon,
.recipesDetailsArea .socialActionRow a:hover .svg use
{ fill:#acb500;}
.recipesDetailsArea .socialActionRow img,
.recipesDetailsArea .socialActionRow svg
{ position:relative; top:3px; width:20px; height:auto; margin-right:5px;}

.recipesDetailsContentArea
{ margin-bottom:35px;}
.recipesDetailsContentArea .recipesSepCol
{ width:2%;}

.recipesDetailsArea .recipesTitRow
{ color:#000; margin-bottom:25px; width:68%}
.recipesDetailsArea .recipesTitRow h1
{ line-height:1.3;}
.recipesDetailsArea .recipesTitRow h1.tit span
{ font-size:16px; line-height:1.3; }

/* Details Col Setting
*****************************/

.recipesDetailsContentArea .detailsCol
{ width:68%; background:#fff; -webkit-box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.2); -moz-box-shadow:0px 0px 10px 0px rgba(0, 0, 0, 0.2); box-shadow:0px 0px 10px 0px rgba(0, 0, 0, 0.2); vertical-align:top;}
.recipesDetailsContentArea .detailsCol .inner
{ padding:20px 30px; margin-bottom:20px;}
.recipesDetailsContentArea .detailsCol .ingredientsRow
{ margin-bottom:30px;}
.recipesDetailsContentArea .detailsCol .ingredientsRow .titRow
{ border-bottom:1px solid #36322d; margin-bottom:30px;}
.recipesDetailsContentArea .detailsCol .ingredientsRow .titCol
{ width:40%; text-align:left; text-align:left; font-size:36px; line-height:1.5; }
.recipesDetailsContentArea .detailsCol .ingredientsRow .miscCol
{ width:60%; text-align:right; font-size:15px; line-height:1.3;}
.recipesDetailsContentArea .detailsCol .ingredientsRow .miscCol span
{ margin-right:10px; border-right:1px solid #36322d; padding-right:10px;}
.recipesDetailsContentArea .detailsCol .ingredientsRow .miscCol span.last
{ margin-right:0px; border-right:none;}
.recipesDetailsContentArea .detailsCol .ingredientsRow .miscCol img
{ position:relative; top:4px; width:20px; height:20px;}

.recipesDetailsContentArea .detailsCol .ingredientsRow .ingredientsContent .lCol,
.recipesDetailsContentArea .detailsCol .ingredientsRow .ingredientsContent .rCol
{ width:49%; text-align:left; color:#36322d; font-size:16px; line-height:1.3; padding-bottom:10px;}
.recipesDetailsContentArea .detailsCol .ingredientsRow .ingredientsContent .mCol
{ width:2%}
.recipesDetailsContentArea .detailsCol .ingredientsRow .ingredientsContent
{ text-align:left; font-size:15px; line-height:1.3; }
.recipesDetailsContentArea .detailsCol .ingredientsRow .ingredientsContent ul li,
.recipesDetailsContentArea .detailsCol .ingredientsRow .ingredientsContent ol li
{ text-align:left; font-size:15px; line-height:1.3; list-style:decimal; margin-left:30px; margin-bottom:10px;}



.recipesDetailsContentArea .detailsCol .methodRow
{ margin-bottom:30px;}
.recipesDetailsContentArea .detailsCol .methodRow .titRow
{ border-bottom:1px solid #36322d; text-align:left; font-size:36px; line-height:1.5; margin-bottom:30px;}
.recipesDetailsContentArea .detailsCol .methodRow p
{ text-align:left; font-size:15px; line-height:1.3; }
.recipesDetailsContentArea .detailsCol .methodRow ul li
{ text-align:left; font-size:15px; line-height:1.3; list-style:decimal; margin-left:30px; margin-bottom:10px;}
.recipesDetailsContentArea .detailsCol .methodRow ol li
{ text-align:left; font-size:15px; line-height:1.3; list-style:decimal; margin-left:30px; margin-bottom:10px;}

.recipesDetailsContentArea .detailsCol .relatedRow
{ text-align:left;}
.recipesDetailsContentArea .detailsCol .relatedRow .titRow
{ text-align:left; font-size:36px; line-height:1.5; margin-bottom:30px;}
.recipesDetailsContentArea .detailsCol .relatedRow .relatedListingArea .item
{ display:inline-block; background:#fff; width:31.2%; margin:0px .8% 0px .8%; transition: box-shadow 300ms cubic-bezier(0.694, 0.048, 0.335, 1), transform 300ms cubic-bezier(0.694, 0.048, 0.335, 1);  -webkit-box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.2); -moz-box-shadow:0px 0px 5px 0px rgba(0, 0, 0, 0.2); box-shadow:0px 0px 5px 0px rgba(0, 0, 0, 0.2); }

.recipesDetailsContentArea .detailsCol .relatedRow .relatedListingArea .item .inner
{ padding:0px; margin:0px;}
.recipesDetailsContentArea .detailsCol .relatedRow .relatedListingArea .item .tmb
{ position:relative; width:100%; height:auto;}
.recipesDetailsContentArea .detailsCol .relatedRow .relatedListingArea .item .tmb img
{ width:100%; height:auto;}
.recipesDetailsContentArea .detailsCol .relatedRow .relatedListingArea .item .descGroup
{ position:relative; width:calc(100% - 30px); padding:15px;}
.recipesDetailsContentArea .detailsCol .relatedRow .relatedListingArea .item .txtArea
{ height:100px;}
.recipesDetailsContentArea .detailsCol .relatedRow .relatedListingArea .item .tit
{ color:#36322d; font-size:25px; line-height:1; font-weight:300; margin-bottom:10px; text-align:center;}
.recipesDetailsContentArea .detailsCol .relatedRow .relatedListingArea .item p
{ color:#36322d; font-size:15px; line-height:1.3; font-weight:300; text-align:center;}




.recipesDetailsContentArea .ingredientsCol
{ width:30%; text-align:left; vertical-align:top;}
.recipesDetailsContentArea .ingredientsCol .tit
{ font-size:22px; line-height:1.3; color:#36322d; margin-bottom:10px;}

.recipesDetailsContentArea .ingredientsCol .item
{ background:#fff; transition: box-shadow 300ms cubic-bezier(0.694, 0.048, 0.335, 1), transform 300ms cubic-bezier(0.694, 0.048, 0.335, 1);  -webkit-box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.2); -moz-box-shadow:0px 0px 5px 0px rgba(0, 0, 0, 0.2); box-shadow:0px 0px 5px 0px rgba(0, 0, 0, 0.2); margin-bottom:10px;}
.recipesDetailsContentArea .ingredientsCol .item:hover
{ -webkit-box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.7); -moz-box-shadow:0px 0px 20px 0px rgba(0, 0, 0, 0.7); box-shadow:0px 0px 20px 0px rgba(0, 0, 0, 0.7);}
.recipesDetailsContentArea .ingredientsCol .item .inner
{ position:relative; padding:12px;}
.recipesDetailsContentArea .ingredientsCol .item .tmb
{ position:relative; float:left; width:30%; height:auto;}
.recipesDetailsContentArea .ingredientsCol .item .tmb img
{ width:100%; height:auto;}
.recipesDetailsContentArea .ingredientsCol .item .tmb .label01
{ position:absolute; top:.5vw; right:.5vw; width:38px; height:38px; margin-bottom:0px;}
.recipesDetailsContentArea .ingredientsCol .item .descGroup
{ position:relative; float:right; width:65%;}
.recipesDetailsContentArea .ingredientsCol .item .tit
{ color:#36322d; font-size:22px; line-height:1; font-weight:300; text-align:left;}
.recipesDetailsContentArea .ingredientsCol .item p
{ color:#36322d; font-size:14px; line-height:1.3; font-weight:300; text-align:left; margin-bottom:30px;}

.recipesDetailsContentArea .ingredientsCol .item .miscRow
{ position:relative; bottom:0px; }
.recipesDetailsContentArea .ingredientsCol .item .miscRow div
{ margin-right:15px;}
.recipesDetailsContentArea .ingredientsCol .item .miscRow .currentPrice
{ display:inline-block; font-size:30px; line-height:1.3; color:#acb500;}
.recipesDetailsContentArea .ingredientsCol .item .miscRow .currentPrice span
{ font-size:22px; line-height:1.3; color:#acb500;}

.recipesDetailsContentArea .ingredientsCol .item .miscRow .orgPrice
{ position:relative; display:inline-block; margin-right:5px;}
.recipesDetailsContentArea .ingredientsCol .item .miscRow .orgPrice del
{ font-size:20px; line-height:1.3; color:#36322d; text-decoration:none;}
.recipesDetailsContentArea .ingredientsCol .item .miscRow .orgPrice del span
{ font-size:15px; line-height:1.3; color:#36322d; text-decoration:none;}
.recipesDetailsContentArea .ingredientsCol .item .miscRow .orgPrice del.cross 
{}

.recipesDetailsContentArea .ingredientsCol .item .miscRow .orgPrice del.cross::before,
.recipesDetailsContentArea .ingredientsCol .item .miscRow .orgPrice del.cross::after
{ content: ''; width: 100%; position: absolute; right: 0; top: 50%;}
.recipesDetailsContentArea .ingredientsCol .item .miscRow .orgPrice del.cross::after
{ border-bottom: 2px solid #36322d; -webkit-transform: skewY(10deg); transform: skewY(10deg); -ms-transform-origin:50% 50%; }


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

/* Details Col Setting
*****************************/
.recipesDetailsContentArea .detailsCol .inner
{ padding:20px 30px; margin-bottom:20px;}

.recipesDetailsContentArea .detailsCol .ingredientsRow
{ margin-bottom:30px; margin-bottom:30px;}
.recipesDetailsContentArea .detailsCol .ingredientsRow .titCol
{ font-size:30px; line-height:1.5; }
.recipesDetailsContentArea .detailsCol .ingredientsRow .miscCol
{ font-size:15px; line-height:1.3;}

.recipesDetailsContentArea .detailsCol .methodRow .titRow
{ font-size:30px; line-height:1.5; margin-bottom:30px;}
.recipesDetailsContentArea .detailsCol .methodRow ul li
{ font-size:15px; line-height:1.3; }

.recipesDetailsContentArea .detailsCol .relatedRow .titRow
{ font-size:30px; line-height:1.5;}
.recipesDetailsContentArea .detailsCol .relatedRow .relatedListingArea .item
{ display:inline-block; width:31.2%; margin:0px .8% 0px .8%;}


.recipesDetailsContentArea .ingredientsCol .tit
{ font-size:20px;}
.recipesDetailsContentArea .ingredientsCol .item .tit
{ font-size:20px;}
.recipesDetailsContentArea .ingredientsCol .item p
{ font-size:14px;}
}

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

/* Details Col Setting
*****************************/
.recipesDetailsContentArea .detailsCol .inner
{ padding:20px 30px; margin-bottom:20px;}

.recipesDetailsContentArea .detailsCol .ingredientsRow
{ margin-bottom:30px;}
.recipesDetailsContentArea .detailsCol .ingredientsRow .titCol
{ font-size:28px; line-height:1.5; }
.recipesDetailsContentArea .detailsCol .ingredientsRow .miscCol
{ font-size:15px; line-height:1.3;}

.recipesDetailsContentArea .detailsCol .methodRow .titRow
{ font-size:28px; line-height:1.5; margin-bottom:30px;}
.recipesDetailsContentArea .detailsCol .methodRow ul li
{ font-size:15px; line-height:1.3; }

.recipesDetailsContentArea .detailsCol .relatedRow .titRow
{ font-size:28px; line-height:1.5;}
.recipesDetailsContentArea .detailsCol .relatedRow .relatedListingArea .item
{ display:inline-block; width:31.2%; margin:0px .8% 0px .8%;}

.recipesDetailsContentArea .detailsCol .relatedRow .relatedListingArea .item .descGroup
{ width:calc(100% - 20px); padding:10px;}
.recipesDetailsContentArea .detailsCol .relatedRow .relatedListingArea .item .txtArea
{ height:100px;}
.recipesDetailsContentArea .detailsCol .relatedRow .relatedListingArea .item .tit
{ font-size:23px;}
.recipesDetailsContentArea .detailsCol .relatedRow .relatedListingArea .item p
{ font-size:15px;}


.recipesDetailsArea .socialActionRow a
{ font-size:20px;} 
.recipesDetailsArea .socialActionRow img,
.recipesDetailsArea .socialActionRow svg
{ top:4px; width:20px;}

.recipesDetailsContentArea .detailsCol .ingredientsRow .ingredientsContent .lCol,
.recipesDetailsContentArea .detailsCol .ingredientsRow .ingredientsContent .rCol
{ display:block; width:100%; }
.recipesDetailsContentArea .detailsCol .ingredientsRow .ingredientsContent .mCol
{ display:none;}

.recipesDetailsContentArea .detailsCol .relatedRow .titRow
{ font-size:28px; line-height:1.5;}
	
}



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

/* Details Col Setting
*****************************/
.recipesDetailsContentArea .detailsCol .inner
{ padding:20px 30px; margin-bottom:20px;}

.recipesDetailsArea .recipesTitRow
{ margin-bottom:25px; width:100%;}
.recipesDetailsArea .recipesTitRow h1.tit span
{ display:block; font-size:16px; }


.recipesDetailsContentArea .detailsCol .ingredientsRow
{ margin-bottom:30px;}
.recipesDetailsContentArea .detailsCol .ingredientsRow .titCol
{ font-size:24px; line-height:1.5; }
.recipesDetailsContentArea .detailsCol .ingredientsRow .miscCol
{ font-size:15px; line-height:1.3;}
.recipesDetailsContentArea .detailsCol .ingredientsRow .ingredientsContent .lCol,
.recipesDetailsContentArea .detailsCol .ingredientsRow .ingredientsContent .rCol
{ font-size:15px; line-height:1.3;}

.recipesDetailsContentArea .detailsCol .methodRow .titRow
{ font-size:24px; line-height:1.5; margin-bottom:30px;}
.recipesDetailsContentArea .detailsCol .methodRow ul li
{ font-size:15px; line-height:1.3; }

.recipesDetailsContentArea .detailsCol .relatedRow .titRow
{ font-size:24px; line-height:1.5;}
.recipesDetailsContentArea .detailsCol .relatedRow .relatedListingArea .item
{ display:inline-block; width:31.2%; margin:0px .8% 0px .8%;}

.recipesDetailsContentArea .detailsCol .relatedRow .relatedListingArea .item .descGroup
{ width:calc(100% - 20px); padding:10px;}
.recipesDetailsContentArea .detailsCol .relatedRow .relatedListingArea .item .txtArea
{ height:100px;}
.recipesDetailsContentArea .detailsCol .relatedRow .relatedListingArea .item .tit
{ font-size:20px;}
.recipesDetailsContentArea .detailsCol .relatedRow .relatedListingArea .item p
{ font-size:15px;}

.recipesDetailsArea .visualArea
{ height:300px;}

.recipesDetailsArea .visualArea .descArea
{ padding:20px;}
.recipesDetailsArea .visualArea .descArea .creatorRow
{ font-size:16px;}
.recipesDetailsArea .visualArea .descArea p
{ font-size:16px; width:80%; }

.recipesDetailsArea .visualArea .descArea .relatedTagRow
{ text-align:center;}
.recipesDetailsArea .visualArea .descArea .relatedTagRow a
{ display:inline-block; padding:10px 20px; white-space:nowrap; color:#36322d; font-size:13px; }


.recipesDetailsArea .socialActionRow a
{ font-size:18px;} 
.recipesDetailsArea .socialActionRow img,
.recipesDetailsArea .socialActionRow svg
{ top:4px; width:18px;}


.recipesDetailsContentArea .recipesSepCol
{ display:none;}


.recipesDetailsContentArea .detailsCol
{ display:block; width:100%;}



.recipesDetailsContentArea .ingredientsCol
{ display:block; width:100%; }


.recipesDetailsContentArea .detailsCol .ingredientsRow .titCol
{ font-size:24px; line-height:1.5; }
}


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

/* Details Col Setting
*****************************/
.recipesDetailsContentArea .detailsCol .relatedRow .relatedListingArea .item
{ display:inline-block; width:47.8%; margin:0px .8% 15px .8%;}

.recipesDetailsContentArea .detailsCol .relatedRow .relatedListingArea .item .descGroup
{ width:calc(100% - 20px); padding:10px;}
}

@media screen and (max-width:425px){
/* Font Size Ratio
font-size:16px; : font-size:4vw;
**************************/

/* Details Col Setting
*****************************/
.recipesDetailsContentArea .detailsCol .inner
{ padding:20px 30px; padding:5vw; margin-bottom:20px; margin-bottom:5vw;}

.recipesDetailsArea .visualArea
{ height:60vw; margin-bottom:6.25vw;}

.recipesDetailsArea .recipesTitRow 
{ margin-bottom:25px; margin-bottom:5vw;}
.recipesDetailsArea .recipesTitRow h1.tit span
{ font-size:16px; font-size:3.5vw;}

.recipesDetailsContentArea .detailsCol .ingredientsRow,
.recipesDetailsContentArea .detailsCol .ingredientsRow .titRow
{ margin-bottom:20px; margin-bottom:5vw;}
.recipesDetailsContentArea .detailsCol .ingredientsRow .titCol
{ display:block; width:100%; font-size:20px; font-size:5vw; line-height:1.5; }
.recipesDetailsContentArea .detailsCol .ingredientsRow .miscCol
{ display:block; width:100%; text-align:left; font-size:15px; font-size:3.5vw; line-height:1.3; padding-bottom:10px;}
.recipesDetailsContentArea .detailsCol .ingredientsRow .miscCol img
{ width:5vw; height:auto;}
.recipesDetailsContentArea .detailsCol .ingredientsRow .ingredientsContent .lCol,
.recipesDetailsContentArea .detailsCol .ingredientsRow .ingredientsContent .rCol
{ font-size:15px; font-size:3.5vw; line-height:1.3;}
.recipesDetailsContentArea .detailsCol .ingredientsRow .ingredientsContent ul li,
.recipesDetailsContentArea .detailsCol .ingredientsRow .ingredientsContent ol li
{font-size:15px; font-size:3.5vw; line-height:1.3; margin-left:30px; margin-left:7.5vw; margin-bottom:10px; margin-bottom:2.5vw;}

.recipesDetailsContentArea .detailsCol .methodRow .titRow
{ font-size:20px; font-size:5vw; line-height:1.5; margin-bottom:20px; margin-bottom:5vw;}
.recipesDetailsContentArea .detailsCol .methodRow p
{ font-size:15px; font-size:3.5vw; line-height:1.3; }
.recipesDetailsContentArea .detailsCol .methodRow ul li
{ font-size:15px; font-size:3.5vw; line-height:1.3;}
.recipesDetailsContentArea .detailsCol .methodRow ol li
{ font-size:15px; font-size:3.5vw; line-height:1.3;}

.recipesDetailsContentArea .detailsCol .relatedRow .titRow
{ font-size:20px; font-size:5vw; line-height:1.5; margin-bottom:20px; margin-bottom:5vw;}
.recipesDetailsContentArea .detailsCol .relatedRow .relatedListingArea .item
{ width:100%; margin:0px 0% 15px 0%;}

.recipesDetailsContentArea .detailsCol .relatedRow .relatedListingArea .item .descGroup
{ width:calc(100% - 20px); padding:10px;}
.recipesDetailsContentArea .detailsCol .relatedRow .relatedListingArea .item .txtArea
{ height:auto; padding:10px 0px;}
.recipesDetailsContentArea .detailsCol .relatedRow .relatedListingArea .item .tit
{ font-size:20px; font-size:5vw;}
.recipesDetailsContentArea .detailsCol .relatedRow .relatedListingArea .item p
{ font-size:15px; font-size:3.5vw;}

}