/*
Theme Name: cake&zakka POUSSIN
URI: https://poussin-petit.com/
Author: cake&zakka POUSSIN
Description: cake&zakka POUSSIN オリジナルテンプレート
Version:2019.11 vol.01
.
*/

/*
英語
font-family: garamond-fb-text, serif;
Regular
font-style: normal;
font-weight: 400;
Bold
font-style: normal;
font-weight: 700;


日本語
font-family: yu-mincho-pr6, sans-serif;
*/

/* CSS Document */
/* -----------------------------------------------------------
reset
----------------------------------------------------------- */
div {   zoom: 1;/*for IE 5.5-7*/}

body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td,figure {
margin:0;
padding:0;
}
address,caption,cite,code,dfn,em,strong,th,var {
font-style:normal;
}
table {
border-collapse:collapse;
border-spacing:0;
border:none;
}
caption,th {
text-align:left;
}
object,
embed {
vertical-align:top;
}
hr,legend {
display:none;
}
h1,h2,h3,h4,h5,h6 {
font-size:100%;
font-weight:normal;
}
img,abbr,acronym,fieldset,a {
border:0;
}
ul li {
list-style-type:none;
}
ol li {
list-style-type:none;
}
img{
vertical-align:bottom;
}

/*-----------------------------------------------------------
body
----------------------------------------------------------- */
/*基本設定*/
body {
font-family: yu-mincho-pr6, sans-serif;
text-align:center;
font-size: 16px;
line-height:1.7em;
background: center no-repeat;
color: #343434;
font-weight: 400;
}

/* IE7でpadding指定 */
*:first-child+html body {
padding-left: 1px;
}
/* IE6以下でpadding指定 */
*html body {
padding-left: 1px;
}
strong{
font-weight: normal;
}
.txtarea strong{font-weight: bold;}
.txtarea p{margin-bottom: 2em;}

/* LayoutClass - Float
============================================================================= */

.alignL { text-align: left; }
.alignR { text-align: right; }
.alignC { text-align: center; }
.alignM { margin: 0px auto; }

.floatL { float: left; }
.floatR { float: right; }
.floatC { clear:both;}

img{width: 100%;height: auto;margin: auto;}

/* Link
============================================================================= */

a{color:#9bb76e; text-decoration:underline;}
a:hover {color:#9bb76e; text-decoration:none;}
a:hover img {opacity: .80; /* Standard: FF gt 1.5, Opera, Safari */
filter: alpha(opacity=80); /* IE lt 8 */
-ms-filter: "alpha(opacity=80)"; /* IE 8 */
-khtml-opacity: .80; /* Safari 1.x */
-moz-opacity: .80; /* FF lt 1.5, Netscape */
}
.w100{width: 100%;height: auto;}

/* -----------------------------------------------------------
ベースレイアウト
iPadなどのレイアウトのインデント調整のため
text-indent: -10000;ではなく下記を使用しています。

text-indent: 100%;
white-space: nowrap;
overflow: hidden;
----------------------------------------------------------- */

/*=======================================================================
各種ラッパー用CSS
=======================================================================*/

#wrapper {
width: 100%;
margin: 0 auto;
text-align: center;
}
.flex {
display:flex;
flex-wrap:wrap;
}
.wrap{overflow: hidden;position: relative;}
.wrap02{overflow: hidden;position: relative;width: 1180px;margin: auto;}
article{
text-align: left;
position: relative;
margin: auto;
}

.boxlayout02{
overflow: hidden;
}
.boxlayout02 .floatR{
width: 35%;
}
.boxlayout02 .floatL{
width: 62%;
margin-right: 3%;
}
.boxlayout02-02{
overflow: hidden;
}
.boxlayout02-02 .floatL{
width: 29%;
margin-left: 6%;
}
.boxlayout02-02 .floatL:first-child{margin-left: 0;}
.boxlayout02-03{
overflow: hidden;
position: relative;
}
.boxlayout02-03 .floatR{
width: 67%;
}
.boxlayout02-03 .floatL{
width: 23%;
margin-right: 6%;
}
.boxlayout02-04{
overflow: hidden;
position: relative;
}
.boxlayout02-04 .floatR{
width: 23%;
margin-right: 6%;
}
.boxlayout02-04 .floatL{
width: 67%;
}


/*=======================================================================
スタイル共有
=======================================================================*/
.titstyle01{
font-family: garamond-fb-text, serif;
font-style: normal;
font-weight: 400;
text-align: center;
font-size: 2em;
color: #264e3c;
margin-bottom: 1em;
}

.titstyle02 {
position: relative;
display: inline-block;
padding: 0 55px;
color: #264e3c;
font-size: 1.2em;
margin-bottom: 1.5em;
}

.titstyle02:before, .titstyle02:after {
content: '';
position: absolute;
top: 50%;
display: inline-block;
width: 45px;
height: 1px;
background-color: #f1ecd6;
}

.titstyle02:before {
left:0;
}
.titstyle02:after {
right: 0;
}

.btnstyle01{
display: inline-block;
padding: 0.5em 2%;
border: 1px solid #2a5240;
color: #2a5240;
text-decoration: none;
width: 30%;
text-align: center;
margin: auto;
font-size: 1.5em;
}

.boxstyle01{
background: #f1ecd6;
padding: 3em 0 2em;
}
.boxstyle02{
background:linear-gradient(90deg,#f1ecd6 50%,#fff 50%);
}
.boxstyle03{
background:linear-gradient(90deg,#fff 50%,#f1ecd6 50%);
}

.tablestyle01{
width: 100%;
border-bottom: 1px solid #f1ecd6;
margin-bottom: 2em;
}
.tablestyle01 th{
width: 20%;
box-sizing: border-box;
border-top: 1px solid #f1ecd6;
padding: 1.5em 0;
}
.tablestyle01 td{
width: auto;
box-sizing: border-box;
border-top: 1px solid #f1ecd6;
padding: 1.5em 0;
}


.newsbox{overflow: hidden;}
.newsbox li{border-bottom: 1px solid #d8cb93;padding: 0.5em 0;overflow: hidden;}
.newsbox li span{
margin-right: 2%;
display: block;
float: left;
width: 10%;
}
.newsbox li p{width:88%; float: left;}
/*=======================================================================
header
=======================================================================*/
header .flex .flexchild01{
width: 17%;
background-color: #29513f;
}
header .flex .flexchild02{
width: 83%;
overflow: hidden;
}
header .flex .flexchild02 .n2-ss-align.n2-ss-align-visible{
width: 100%;
}

header h1{margin-bottom: 2em;}

header .flex .boxin{
float: right;
padding: 2em 8% 0;
width: 62%;
}

header .flex .boxina{color: #fff;}

.gnav{
text-align: left;
font-family: garamond-fb-text, serif;
font-style: normal;
font-weight: 400;
margin-left: 10%;
margin-bottom: 2em;
}
.gnav li{margin: 1em 0;}
.gnav a{text-decoration: none; color: #fff;font-size: 1.3em;}
.gnav .navon a,.gnav .navon a:hover{color: #c7bb7b;}

header .icoarea{
overflow: hidden;
width: 90%;
margin-left: 10%;
}
header .icoarea li{
width: 19%;
margin: 0 3%;
float: left;
}

/*=======================================================================
footer
=======================================================================*/
.gallerybox{background: url("images/gallerybox_01.jpg")no-repeat top center;background-size: cover;}
.gallerybox p{padding: 4em 0;width: 16%; margin: auto;}
footer{background-color: #28503f;color: #fff; padding: 3em 0;text-align: left;}
footer a{color: #fff;text-decoration: none;}
footer h1{margin-bottom: 2em;}
footer iframe{border: none;width: 100%; height: 300px;margin-bottom: 1em;}
footer nav{
font-family: garamond-fb-text, serif;
font-style: normal;
font-weight: 400;
margin-bottom: 1.2em;
font-size: 1.2em;
letter-spacing: 0.1em;
}
footer nav li{margin-bottom: 0.5em;}
footer .icoarea{overflow: hidden;}
footer .icoarea li{
width: 9%;
margin: 0 3%;
float: left;
}
.copy{text-align: center;margin: 2em 0 0;}

/*ページトップ*/
#p_top_area{
position:fixed;
bottom: 10px;
right:10px;
z-index: 1000;
}


.pc{
display:block;}
.mb{
display:none;
}

.slicknav_menu {
display:none;
}

.titarea{text-align: center;}
.titarea img{
width: 22%;
height: auto;
margin: auto;
}

.wp-pagenavi{
height: 33px;
text-align: center;
margin-top: 2em;
}

@media (max-width:1300px) {
header .flex .boxin {
padding: 1em 8% 0;
}
header h1 {
margin-bottom: 1em;
}
.gnav{margin-bottom: 0.5em;}
.gnav li {
margin: 0.2em 0;
}
header .icoarea{
width: 70%;
}
.gnav a{font-size: 1em;}
}

@media (max-width:1180px) {
.wrap02{overflow: hidden;position: relative;width: 96%;margin: auto;}
}
@media (max-width:980px) {
header .flex .flexchild02{width: 85%;}
header .flex .flexchild01{width: 15%;}
.gnav li {margin: 0 0;}

.gallerybox p {
padding: 3em 0;
width: 26%;
}
.boxlayout02-03 .floatL {
width: 24%;
margin-right: 6%;
margin-left: 3%;
}
.boxlayout02-04 .floatR {
width: 24%;
margin-right: 6%;
margin-left: 3%;
}
}


@media (max-width:740px) {

body{min-width: 100%;-webkit-text-size-adjust: 100%;}
.txtarea p {
margin-bottom: 1.2em;
}

.floatL { float: none ; }
.floatR { float: none ; }
.floatC { clear:both ; }

img{width: 100%; height: auto;	}
.pc{
display:none;}
.mb{
display:block;
}

.tablestyle01{
overflow: hidden;
margin-bottom: 1em;
}
.tablestyle01 th{
width: 100%;
float: left;
padding: 1em 0;
display: inline;
text-align: center;
}
.tablestyle01 td{
width: 100%;
float: left;
padding: 1em 0;
display: inline;
text-align: center;
}

.wrap02{width: 90%;}
.boxlayout02 .floatR{
width: 100%;
margin: auto;
}
.boxlayout02 .floatL{
width: 100%;
padding: 1em 0 2em;
}

.boxlayout02-02 .floatL{
width:100%;
margin-left: 0;
}
.boxlayout02-03 .floatL {
width: 40%;
margin-right: auto;
margin-left: auto;
}
.boxlayout02-03 .floatR {
width: 100%;
}
.boxlayout02-04 .floatR {
width: 40%;
margin-right: auto;
margin-left: auto;
}
.boxlayout02-04 .floatL {
width: 100%;
}

.newsbox li span{
margin-right: 0;
float: none;
width: 100%;
}
.newsbox li p{width: 100%; float: none;}

header .flex .flexchild02{width: 100%;}
header .flex .flexchild01{width: 100%;}

header .flex .boxin{
padding: 1em 0 0 2%;
width: 98%;
overflow: hidden;
}
header h1.mb{float: left;}

.mbmenu nav{
display: none;
position: absolute;
top: 57px;
width: 100%;
background-color: #28503f;
left: 0;
z-index: 20000;
}
header .mbmenu nav ul{
display: block;
margin: 0 auto;
width: 90%;
}
header .mbmenu nav ul li{
margin: 1em auto;
text-align: left;
border-bottom: 1px solid #fff;
padding: 0 0 1em 0;
}
header .mbmenu nav ul li:last-child{
border: none;
}
header .mbmenu nav ul li a{
display: block; 
color: #fff;
text-decoration: none;
}
/*開閉ボタン*/
#nav_toggle{
display: block;
width: 40px;
height: 40px;
position: absolute;
top: 20px;
right: 10px;
z-index: 1000000;
}
#nav_toggle div {
position: relative;
}
#nav_toggle span{
display: block;
height: 3px;
background: #fff;
position:absolute;
width: 100%;
left: 0;
-webkit-transition: 0.5s ease-in-out;
-moz-transition: 0.5s ease-in-out;
transition: 0.5s ease-in-out;	
}
#nav_toggle span:nth-child(1){
top:0px;
}
#nav_toggle span:nth-child(2){
top:12px;
}
#nav_toggle span:nth-child(3){
top:24px;
}

/*開閉ボタンopen時*/
.open #nav_toggle span:nth-child(1) {
top: 12px;
-webkit-transform: rotate(135deg);
-moz-transform: rotate(135deg);
transform: rotate(135deg);
}
.open #nav_toggle span:nth-child(2) {
width: 0;
left: 50%;
}
.open #nav_toggle span:nth-child(3) {
top: 12px;
-webkit-transform: rotate(-135deg);
-moz-transform: rotate(-135deg);
transform: rotate(-135deg);
}
header .icoarea {
width:50%;
margin: 0 auto;
}
header .mbmenu nav .icoarea ul li{border-bottom: none;margin: 0 4% 10px;width:17%;}

footer h1{margin:0 auto 2em;width: 70%;}
footer nav{margin-bottom: 2em;}
footer nav li{
border-bottom: 1px solid #fff;
padding: 0.5em 0;
text-align: center;
}

footer .icoarea {
position: relative;
overflow: hidden;
width: 30%;
margin: auto;
}

footer .icoarea ul {
position:relative;
left:50%;
float:left;
}

footer .icoarea li{
position:relative;
left:-50%;
float:left;
width: 27%;
}

/*ページトップ*/
#p_top_area{
bottom: 20px;
}
#p_top_area img{
width: 60%;
}
.gallerybox{background: url("images/gallerybox_01-mb.jpg")no-repeat;}
.gallerybox p {
width: 56%;
}
.titarea img{width: 50%;}
}

/*=======================================================================
home
=======================================================================*/
.home #box01{padding: 3em 0;}
.home #box01 .floatL{
background: url("images/home/sec01_bg01.png") no-repeat top center;
background-size: contain;
text-align: center;
font-size: 1.1em;
width: 46%;
padding: 4em 8% 0;
}
.home #box01 .floatL .btnstyle01{font-size: 1em;}

.home #box02 .titarea p{
width: 22%;
margin: 0 auto 1em;
}

.home .arrowarea{
text-align: center;
width: 3%;
margin: 2em auto 0;
}

.home #box03{padding: 2em 0;}
.home #box03 .titarea p{
width: 86%;
margin: 0 auto 2em;
}
.home #box03 .flex{
display: flex;
flex-wrap: wrap;
justify-content: flex-start;

}
.home #box03 .flex a{
width: 23.5%;
margin-right: 2%;
margin-bottom: 2em;
text-decoration: none;
color: #140d0c;
}
.home #box03 .flex a:nth-child(4n){
margin-right:0%;
}

@media (max-width:740px) {
.home #box01 {
    padding: 1.5em 0;
}
.home #box01 .titstyle01{margin: 0.5em;}
.home #box01 .floatL{
background: none;
float: none;
width: 100%;
padding: 0 0 1em;
    font-size: 0.9em;
	line-height: 1.5;
}
.home #box01 .floatR{float: none;width: 80%;}
.arrowarea {
width: 10%;
}
.home #box02 .titarea p {
    width: 30%;
}
.home #box03 .flex a {
width: 48%;
margin-right: 4%;
}
.home #box03 .flex a:nth-child(4n){
margin-right: 4%;
}
.home #box03 .flex a:nth-child(2n){
margin-right:0%;
}
.home #box03 .titarea p{width: 83%;}
.home .arrowarea{width: 8%;margin-top: 0;}
}


/*=======================================================================
news
=======================================================================*/
#news #box01,.single-news_data #box01{padding: 5em 0 5em;}
#news #box01 h3,.single-news_data #box01 h3{margin-bottom: 2em;}
@media (max-width:740px) {
#news #box01,.single-news_data #box01 {padding: 2em 0 3em;}
}

/*=======================================================================
about
=======================================================================*/
#about #box01{padding: 2em 0 5em;}
#about #box01 h3{padding-top: 8em;}

#about #box02{text-align: center;padding: 5em 0;}
#about #box02 h3{margin-bottom: 1.5em;}

#about #box02 .flex dl {
width: 10.5%;
margin: 0 3% 0.5em;
font-size: 0.8em;
line-height: 1.2em;
}
#about #box02 .flex dt{margin-bottom: 0.5em;}
#about #box02 .area03{
width: 50%;
float: left;
}
#about #box02 .area01{margin-bottom: 2em;}
#about #box02 .area02{margin-bottom: 2em;}
#about #box02 .wrap{margin-bottom: 2em;}
#about #box02 .area03 .flex dl {
width: 20%;
margin: 0 4.4% 0.5em;
}
#about #box02 .area04{
width: 50%;
float: right;
}
#about #box02 .area04 dl{
overflow: hidden;
width: 40%;
}
#about #box02 .area04 dt{overflow: hidden;}
#about #box02 .area04 img {
float: left;
display: inline-block;
width: 50%;
}

#about #box03{text-align: center;padding: 5em 0;}


@media (max-width:740px) {
#about #box01,#about #box02 {
padding: 2em 0 3em;
}
#about #box03{padding: 3em 0 3em;}
#about #box01 h3,#about #box03 h3 {
padding-top: 0;
margin-bottom: 1em;
}
#about #box02 .flex dl{width: 27.3%;}
#about #box02 .area03 {
width: 100%;
float: none;
}
#about #box02 .area03 .flex dl{
width: 28.9%;
margin: 0 2.2% 0.5em;
}
#about #box02 .area04 {
width: 100%;
float: none;
margin-top: 1.5em;
}
#about #box02 .area04 dl{width: 57.9%;}
}



/*=======================================================================
access
=======================================================================*/
#access #box01{padding: 5em 0 5em;}
#access #box01 h3{padding-top: 8em;}
#access #box02 iframe{width: 100%;height: 650px;border: none;vertical-align: bottom;}

@media (max-width:740px) {
#access #box01 {
padding: 2em 0 3em;
}
#access #box01 h3 {
padding-top: 0;
margin-bottom: 1em;
}
#access #box02 iframe{width: 100%;height: 300px;}
}


/*=======================================================================
galley
=======================================================================*/
#galley #box01,.single-galley_data #box01{padding: 5em 0 5em;}
#galley #box01 h3,.single-galley_data #box01 h3{margin-bottom: 2em;}
#galley #box01 .flex,.single-galley_data #box01 .flex{
display: flex;
flex-wrap: wrap;
justify-content: flex-start;

}
#galley #box01 .flex a,.single-galley_data #box01 .flex a{
width: 23.5%;
margin-right: 2%;
margin-bottom: 2em;
text-decoration: none;
color: #140d0c;
text-align: center;
}
#galley #box01 .flex a:nth-child(4n),.single-galley_data #box01 .flex a:nth-child(4n){
margin-right:0%;
}
@media (max-width:740px) {
#galley #box01,.single-galley_data #box01 { padding: 2em 0 0em;}
#galley #box01 .flex a,.single-galley_data #box01 .flex a {
width: 48%;
margin-right: 4%;
}
#galley #box01 .flex a:nth-child(4n),.single-galley_data #box01 .flex a:nth-child(4n){
margin-right: 4%;
}
#galley #box01 .flex a:nth-child(2n),.single-galley_data #box01 .flex a:nth-child(2n){
margin-right:0%;
}
#galley #box01 .titarea p,.single-galley_data #box01 .titarea p{width: 33%;}
.home .arrowarea{width: 8%;}
}



/*=======================================================================
contact
=======================================================================*/
#contact #box01{padding: 5em 0 5em;}
#contact #box01 h3{padding-top: 8em;}
#contact #box02{padding: 5em 0 5em;}
#contact #box02 h3{padding-bottom: 2em;}
#contact #box02 input,#contact #box02 textarea{padding: 1em 2%;border: none;background-color: #f1ecd6;width: 80%;}

#contact #box02 input.wpcf7-submit{
color: #fff;
background-color: #27503e;
width: auto;
padding: 0.8em 5%;
font-size: 1.2em;
font-family: yu-mincho-pr6, sans-serif;
cursor:pointer;
}
#contact #box02 input.wpcf7-submit:hover{opacity: 0.8;}
@media (max-width:740px) {
#contact #box01 {
padding: 2em 0 3em;
}
#contact #box01 h3 {
padding-top: 0;
margin-bottom: 1em;
}
#contact #box02{padding: 2em 0 2em;}
#contact #box02 h3{padding-bottom:1em;}
#contact #box02 input.wpcf7-submit{padding: 0.3em 7%;}
}


/*=======================================================================
blog
=======================================================================*/
.blogbox {padding: 5em 0 5em;}
.blogbox .titarea p {
width: 86%;
margin: 0 auto 2em;
}
.blogbox .maincontent{width: 65%;float: right;}
.blogbox .maincontent h4{font-size: 1.2em;margin-bottom: 1em;}

.blogbox aside{
width: 20%;
float: left;
padding: 5em 4% 3em;
}
.blogbox aside{background-color: #f1ecd6;}
.blogbox aside h3{
color: #274f3d;
padding: 0 0 2em 0;
text-align: center;
background: url(images/blog/line.png) no-repeat bottom center;
background-size: contain;
font-size: 1.3em;
margin: 0 0 1.5em 0;
}
.blogbox aside li{margin-bottom: 1em;line-height: 1.2em}
.blogbox aside .news_list span{display: block;}
.blogbox aside div{margin-bottom: 2em;}
.blogbox aside a{color: #000;text-decoration: none;}
.blogbox aside a:hover{text-decoration: underline;}

.contents{margin-bottom: 3em;}
.blogbox .day span{background-color: #294139;color: #fff;font-size: 0.8em;}

@media (max-width:740px) {
.blogbox {
padding: 2em 0 3em;
}
.blogbox .maincontent{width:100%;float: none;}
.blogbox .maincontent h4{font-weight: bold;margin-bottom:1em;}
.blogbox aside{
width: 92%;
float: none;
padding: 2em 4%;
margin-top: 2em;
}
.blogbox aside h3{background-size: auto;}
.blogbox .titarea img {
width: 60%;
}
.contents{margin-bottom:2em;}
}