@charset "utf-8";
/* default */
@import url("reset.css");
@import url("common.css");
@import url("contest.css");
@import url("global.css");
@import url("responsive.gs.24col.css");
@import url("lightbox.min.css");
@import url("slider-pro.min.css");

/* **************** */
@import url(https://netdna.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.css);
@import url(https://use.fontawesome.com/releases/v5.7.1/css/all.css);

/*　新タウン追記
--------------------------------------------------------------------*/
.pane-contents {
 /*background: url(/img/usr/category/ccouture/baseBg.jpg) repeat #f1d6db;*/
 padding-top: 0;
}
.pane-main {
 background: url(/img/usr/category/ccouture/baseBg.jpg) repeat #f1d6db !important;
 padding-bottom: 30px;
}
.block-globalnav,
.block-category-globalnav {
}
.block-category-list{
 background: url(/img/usr/category/ccouture/baseBg.jpg) repeat #f1d6db !important;
}
.block-category-list--header,
.block-category-list--comment,
.block-category-list--goods {
 display: none;
}
.sns_ccBox {
 float: right;
 padding-top: 10px;
}
.sns_cc {
 margin: 0 10px 5px 0;
}
.sns_cc .fb {
 width: 110px;
 float: right;
 font-size: 80%;
 color: #fff;
}
.sns_cc .fb a {
 background-color: #4267b2;
 background-image: linear-gradient(to bottom, #4267b2, #224ca2);
 border-radius: 30px;
 color: #fff;
 margin: 20px 10px 10px;
 padding: 5px 10px;
 text-align: center;
 text-decoration: none;
}
.sns_cc .fb a:hover {
 background-color: #4267b2;
 background-image: linear-gradient(to bottom, #4267b2, #224ca2);
 margin: 20px 10px 10px;
 padding: 5px 10px;
 text-align: center;
}
.sns_cc .insta {
 float: right;
}
.h_btn_r {
 text-align: right;
 font-size: 80%;
}
.h_btn_r a {
 background-color: #e498a9;
 background-image: linear-gradient(to bottom, #e498a9, #b56175);
 border-radius: 30px;
 color: #fff;
 margin: 20px 10px 10px;
 padding: 5px 10px;
 text-align: center;
 text-decoration: none;
}
.h_btn_r a:hover {
 background-color: #e498a9;
 background-image: linear-gradient(to bottom, #e498a9, #b56175);
 margin: 20px 10px 10px;
 padding: 5px 10px;
 text-align: center;
}
.cc_bnr_headTop {
 margin-bottom:10px;
 text-align:center;
}
/*クレイクチュールは*/
#whatClay {
 background: #ece4e6;
 margin: 1em;
 padding: 1em;
}
#whatClay p{
 /*line-height: 1.8;*/
 padding: .5em 1em 0;
}
#whatClay img{
 max-width: 98%;
}
/*クレイクチュール特長*/
#feature {
 margin: .5em;
}
#feature .span_12{
 padding: 0 .5em;
 margin: .5em 0;
}
#feature .span_12 h3{
 margin-top: .5em;
 text-align: center;
}
#feature .span_12 p{
 padding: .5em;
}
#feature .span_12 img{
 -moz-border-radius: 5px;
 -webkit-border-radius: 5px;
 border-radius: 5px;
}
#feature .span_12:first-child{
 border-bottom: 1px dashed #ccc;
}
.block2Wrap p {
 margin: 5% 0;
}
#moshikomi,
#toiawase {
 border: 1px solid #ded6d8;
 -moz-border-radius: 10px;
 -webkit-border-radius: 10px;
 border-radius: 10px;
 color: #4d4032;
 display: block;
 padding: 10px;
 margin: 20px 10px 50px;
 text-decoration: none;
 background-color: #f9f0f2;
 background-image: -webkit-gradient(linear, left top, left bottom, from(#f9f0f2), to(#ece4e6));
 background-image: -webkit-linear-gradient(top, #f9f0f2, #ece4e6);
 background-image: -moz-linear-gradient(top, #f9f0f2, #ece4e6);
 background-image: -ms-linear-gradient(top, #f9f0f2, #ece4e6);
 background-image: -o-linear-gradient(top, #f9f0f2, #ece4e6);
 background-image: linear-gradient(to bottom, #f9f0f2, #ece4e6);
 filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#f9f0f2, endColorstr=#ece4e6);
}
#moshikomi h3,
#toiawase h3{
 border-left: 10px solid #d15262;
 padding-left: 10px;
 margin: 5px 5px 10px;
}
#moshikomi p,
#toiawase p{
 margin: .5em;
}
#moshikomi a,
#toiawase a{
 color: #333;
 word-break : break-all;
 word-wrap : break-word;
 overflow-wrap : break-word;
}
#moshikomi a:hover,
#toiawase a:hover{
 color: #d15262;
}
/*-- Facebook --*/
.fb_cc {
 text-align: center;
 padding: 20px;
}
/*各ページH1*/
.pageHeader{
 margin: 2em .2em 2em;
}
.pageHeader h1{
 padding-top: 1em;
 text-align: center;
}
.pageHeader .leadTxt {
 /* font-size: 1.8rem; */
 font-size: 18px;
 /*line-height: 3.2rem;*/
 padding: 1em 2em;
}
.pageHeader .leadTxt span{
 display: block;
 margin: .3em 1em;
}
.pageHeader .leadTxt span a{
 color: #b56175;
}
.pageHeader .leadTxt span.tel::before{
 color: #b56175;
 content:"\f095\00a0";
 font-family: "FontAwesome";
}
.pageHeader .leadTxt span.mail::before{
 color: #b56175;
 content:"\f003\00a0";
 font-family: "FontAwesome";
}
/**************レシピ＆動画 *************************/
#startClay{
 /*background: rgba(233,83,119,.5);*/
 /*background: rgba(247,199,205,1);*/
 background: rgba(86,190,165,.2);
 margin: 2em 0 3em;
 padding: 1em;
}
#startClay h2{
 color: #36291b;
 padding: .5em 1em;
}
#startClay h2 span.series{
 border: 4px double rgba(86,190,165,1);
 color: rgba(86,190,165,1);
 display: inline-block;
 font-size: 18px;
 /* font-size: 1.8rem; */
 /*line-height: 2rem;*/
 margin-right: .5em;
 padding: .4em .5em .3em;
}
#startClay p.lead{
 padding: 1em;
}
#startClay ul{
 padding: .5em 1em;
}
#startClay .span_12{
 width: 49.0%;
}
#startClay .span_12:nth-child(even){
 margin-left: 2%;
}
#startClay .span_12 .box{
 display: block;
 position: relative;
 margin: 15px auto;
 box-sizing: border-box;
}
#startClay .ribbonArea {
 position: absolute;
 top: -6px;
 right: -6px;
 width: 89px;
 height: 91px;
 overflow: hidden;
}
#startClay .ribbon {
 display: inline-block;
 position: absolute;
 padding: 7px 0;
 left: -24px;
 top: 22px;
 width: 160px;
 text-align: center;
 font-size: 18px;
 /* font-size: 1.8rem; */
 line-height: 16px;
 background: rgba(86,190,165,1);
 color: #fff;
 letter-spacing: 0.05em;
 -webkit-transform: rotate(45deg);
 -ms-transform: rotate(45deg);
 transform: rotate(45deg);
 box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
}
#startClay .ribbon:before,.ribbon:after{
 position: absolute;
 content: "";
 border-top: 4px solid rgba(65,151,130,1);
 border-left: 4px solid transparent;
 border-right: 4px solid transparent;
 bottom: -4px;
}
#startClay .ribbon:before{
 left: 14px;
}
#startClay .ribbon:after{
 right: 18px;
}
/*レシピ＆動画 */
#movieArea #latestRecipe,
#recipeArea #latestRecipe{
 background: #efefef;
 -moz-border-radius: 10px;
 -webkit-border-radius: 10px;
 border-radius: 10px;
 padding: 1em;
 margin: 1em;
}
#movieArea #latestRecipe .span_13,
#movieArea #latestRecipe .span_11,
#recipeArea #latestRecipe .span_13,
#recipeArea #latestRecipe .span_11{
 padding: 0 2%;
}
#movieArea h2,
#recipeArea h2{
 text-align: center;
}
#movieArea h2 img,
#recipeArea h2 img{
 margin: .8em 0 0;
}
#movieArea #latestRecipe p,
#recipeArea #latestRecipe p{
 margin-bottom: 5px;
}
.pageHeader .leadTxt span.leadBld{
 color: #e95377;
 display: inline-block;
 font-weight: bold;
 margin: 0;
}
#movieArea p.leadBld{
 color: #e95377;
 display: inline-block;
 font-weight: bold;
 margin: 0;
 padding: 1em 2em;
}
#movieArea p.goodsPic{
 margin: 1em 0;
}
#movieArea #latestRecipe .latestNew,
#recipeArea #latestRecipe .latestNew{
 background: rgba(86,190,165,1);
 color: #fff;
 -moz-border-radius: 8px 0 8px 0;
 -webkit-border-radius: 8px 0 8px 0;
 border-radius: 8px 0 8px 0;
 font-size: 13px;
 /* font-size: 1.3rem; */
 letter-spacing: 0.1rem;
 margin: 1% 2%;
 text-align: center;
 width: 60px;
}
#movieArea #latestRecipe .latestWork,
#recipeArea #latestRecipe .latestWork{
 font-family: "Times New Roman", "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "ＭＳ Ｐ明朝", "MS PMincho", "メイリオ", Meiryo, serif;
 font-size: 26px;
 font-size: 2.6rem;
 font-weight: bold;
 padding: 1% 2%;
}
#movieArea #latestRecipe .latestArtist,
#recipeArea #latestRecipe .latestArtist{
 text-align: right;
 font-size: 14px;
 /* font-size: 1.4rem; */
 padding-right: 1%;
}
#movieArea #latestRecipe .latestTxt,
#recipeArea #latestRecipe .latestTxt{
 border-top: 1px dashed rgba(86,190,165,1);
 font-size: 13px;
 /* font-size: 1.3rem; */
 margin-top: 10px;
 padding-top: 5px;
}
#movieArea ul,
#recipeArea ul{
 margin: 2em 0;
}
#movieArea .span_8,
#recipeArea .span_8{
 border: 1px solid #dedede;
 font-size: 12px;
 /* font-size: 1.2rem; */
 letter-spacing: 0;
 width: 48%;
 margin: 0 1% 1em;
 padding: 1em 0;
}
#movieArea .span_8:nth-child(odd),
#recipeArea .span_8:nth-child(odd){
 margin: 0 0 0 2%;
}
#movieArea .span_8 p,
#recipeArea .span_8 p{
 text-align: center;
}
#movieArea .span_8 p img.downloadRecipe,
#recipeArea .span_8 p img.downloadRecipe{
 padding: 1.2em 1.2em 0;
}
#movieArea .span_8 p:hover,
#recipeArea .span_8 p:hover{
 /*cursor: pointer;
 opacity: 0.8;*/
}
#movieArea .span_8 p span.nameRecipe,
#recipeArea .span_8 p span.nameRecipe{
 display: block;
 font-size: 16px;
 /* font-size: 1.6rem; */
 font-weight: bold;
 padding: 0 1em;
}
#movieArea .span_8 p span.new,
#recipeArea .span_8 p span.new{
 background: rgba(86,190,165,1);
 -moz-border-radius: 3px;
 -webkit-border-radius: 3px;
 border-radius: 3px;
 color: #fff;
 display: inline-block;
 font-size: 12px;
 /* font-size: 1.2rem; */
 padding: 1px 3px;
 margin-right: 3px;
}
#movieArea .span_8 p.txtRecipe,
#recipeArea .span_8 p.txtRecipe{
 font-size: 12px;
 /* font-size: 1.2rem; */
 text-align: left;
 padding: 0 1.2em;
}
#movieArea .youtube{
 position: relative;
 width: 100%;
 padding-top: 55%;
 margin: 1em 0;
}
#movieArea .youtube iframe{
 position:absolute;
 top: 0;
 right: 0;
 width: 100%;
 height: 100%;
}
#movieArea ul,
#recipeArea ul{
 margin: 2em 0;
}
#movieArea ul ul{
 margin: 0;
}
#movieArea ul li.movieList{
 border: 1px solid #dedede;
 letter-spacing: 0;
 margin: 0 1em 2em;
 padding: 1em;
}
#movieArea ul li.movieList p{
 margin-bottom: 0;
}
#movieArea ul li.movieList p span.nameRecipe{
 border-bottom: 2px dotted #999;
 display: block;
 font-size: 16px;
 /* font-size: 1.6rem; */
 font-weight: bold;
 padding-bottom: .5em;
 margin-bottom: 1em;
}
#movieArea ul li.movieList p span.new{
 background: rgba(86,190,165,1);
 -moz-border-radius: 3px;
 -webkit-border-radius: 3px;
 border-radius: 3px;
 color: #fff;
 display: inline-block;
 font-size: 12px;
 /* font-size: 1.2rem; */
 padding: 1px 3px;
 margin-right: 3px;
}
#movieArea ul li.movieList p.txtRecipe{
 font-size: 12px;
 /* font-size: 1.2rem; */
 text-align: left;
 padding: 0 1.2em;
}
/* SNSボタン */
.snsBtn {
 margin: 1em 1em 0 .5em;
 text-align: right;
}
.snsBtn a{
 background: #9e9e9e;
 color: #fff;
 display: inline-block;
 text-align: center;
 width: 40px;
 height: 40px;
 -webkit-border-radius: 40px;
 -moz-border-radius: 40px;
 border-radius: 40px;
}
.snsBtn a{
 font-size: 23px;
 font-size: 2.3rem;
 padding: 7px;
}
#movieArea .snsBtn {
 margin: .5em;
 text-align: right;
}
#movieArea .snsBtn a{
 background: #9e9e9e;
 color: #fff;
 display: inline-block;
 text-align: center;
 width: 30px;
 height: 30px;
 -webkit-border-radius: 30px;
 -moz-border-radius: 30px;
 border-radius: 30px;
}
#movieArea .snsBtn a{
 font-size: 13px;
 /* font-size: 1.3rem; */
 padding: 2px;
}
/***********************************************************/
/***********************************************************/
@media print, screen and (max-width: 767px) { 
.span_halfm10 {
 width: 92%;
}
.cc_bnr_headTop {
 margin:10px;
 text-align:center;
}
}
/***********************************************************/
/***********************************************************/
@media print, screen and (min-width: 768px) {
/*クレイクチュールは*/
#whatClay img{
 max-width: 100%;
}
/*クレイクチュール特長*/
#feature {
 margin: .5em 1em;
}
#feature .span_12{
 padding: 0 .5em;
 margin: .5em 0;
 border-right: 1px dashed #ccc;
}
#feature .span_12:first-child{
 border-bottom: 0;
}
#feature .span_12:last-child{
 border-right: 0;
}
#moshikomi p,
#toiawase p{
margin: .5em 2em;
}
/*各ページH1*/
.pageHeader{
 margin: 3em .2em 2em;
}
/*レシピ・動画 */
#movieArea #latestRecipe .span_13,
#movieArea #latestRecipe .span_11,
#recipeArea #latestRecipe .span_13,
#recipeArea #latestRecipe .span_11{
 padding: 0;
}
#movieArea h2 img,
#recipeArea h2 img{
 margin: 3em 0 .5em;
}
#movieArea .span_8,
#recipeArea .span_8{
 width: 32.0%;
}
#movieArea .span_8:nth-child(odd),
#recipeArea .span_8:nth-child(odd){
 margin: 0;
}
#movieArea .span_8:nth-child(3n+1),
#recipeArea .span_8:nth-child(3n+1){
 margin-left: 1%;
}
#recipeArea #latestRecipe .latestTxt{
 font-size: 15px;
 font-size: 1.5rem;
}
#movieArea p.goodsPic{
 margin: 0;
}
}
/***********************************************************/
/***********************************************************/
@media screen and (min-width : 1024px) {
/* PC */
/*nav{
 display: block;
 font-size: 16px;
 font-size: 1.6rem; 
 width: 100%;
}*/
}