@charset "utf-8";
/* CSS Document */
header{
height: 450px;
background-color:#E9E9E9;
}

@media(max-width:1080px) {
header{
min-height: 400px;
height:100%;
}	
}

.sub_title{
border-top: 1px solid #000;
border-bottom: 1px solid #000;
text-align: center;
margin: 0 auto 2em;
width: 100%;
max-width: 430px;
}

@media(max-width:768px) {
.global-header {
position: relative;
margin: auto;
background-color: #e9e9e9;
}
}

.header-comment{
text-shadow:6px 6px 6px #fff;
font-size: 2.5rem;
text-align: center;
color: #000;
font-weight: bold;
position: absolute;
left: 0;
right: 0;
bottom: 0;
margin: auto;
height: 311px;
z-index: 7;
box-sizing: border-box;
}
.header-comment img{
width:100%;
max-width:500px;
margin:auto;
}

@media(max-width:1080px) {
.header-comment{
font-size: 2rem;
/*top: 0;*/
max-height: 246px;
}
.header-comment img{
max-width:300px;
}
}
@media(max-width:768px) {
.header-comment {
top: 26%;
}
}
@media(max-width:414px) {
.header-comment {
font-size: 1.2rem;
top: 48%;
}
.sub_title{
max-width: 350px;
}	
}


/*コンテンツ*/
@media(max-width:768px) {
.flex_sp-block{
display:block;
}
}
section{
padding-bottom:3.5em;
}

.pagetitle {
margin: auto;
text-align: center;
}
h2{
font-size:1.8rem;
position: relative;
line-height: 1;
}
h2 span{
padding: 0 45px;
font-size: 1.8rem;
}
h2:before, h2:after{
display: block;
content: "";
position: absolute;
top: 50%;
width: 43%;
height: 1px;
margin-top: -1px;
background: #231815;
z-index: 1;
}

.flex-box h2:before, .flex-box h2:after{
width: 25%;
}

h2:before{
left: 0;
}

h2:after{
right: 0;
}
.pagetitle h3{
font-size: 1.8rem;
padding:1.5vw 0 0 0;
}

.flex-box .pagetitle h3{
padding:1.5vw 0;
}


.flex-box dl{

}
.flex-box dt{
margin-right:9em;
font-size: 1.3rem;
}
.flex-box dd{
margin-left:9em;
margin-top:-1.8em;
font-size: 1.3rem;
}
.concept_wrapper h2 img{
width: 100%;
max-width: 35px;
margin: auto;
vertical-align: bottom;
}
.concept_wrapper p{
font-weight:bold;
font-size:1.6rem;
line-height: 3;
padding:0.8vw 0;
}
.pagetitle {
margin-bottom: 2vw;
}
@media(max-width:768px) {
section{
padding-bottom:0;
}
h2:before, h2:after{
width: 21%;
}

.concept_wrapper p{
line-height: 2.1;
}
h2.challenge_title_wrap span{
padding: 0 3.3vw;
}

h2.challenge_title_wrap:before, h2.challenge_title_wrap:after{
width: 10%;
}
.pagetitle {
margin-top: 8vw;
}
.pagetitle h3{
font-size: 1.7rem;
padding:1.5vw 0 3.5vw 0;
}
}


.flex-block-blog_concept{
padding:0 2vw;
box-sizing: border-box;
width:64%;
font-size: 1.4rem;
}
.flex-block{
width:36%;
}

.flex-block p{
font-size:1.6rem;
padding: 2vw 0 4vw 0;
}
.flex-block_pc{
width:75%;	
}
.flex-block_sp{
width:25%;
padding:60px 30px 0 30px;
box-sizing: border-box;	
}

.imgWrap50{
width:50%;
padding:30px;
box-sizing: border-box;
}

@media(max-width:768px) {
.flex-block-blog_concept{
width:100%;
}
.flex-block{
width:100%;
}
.flex-block_pc{
width:75%;	
}
.flex-block_sp{
width:25%;
padding:60px 5px 0 15px;
box-sizing: border-box;	
}
.imgWrap50{
padding:10px;
}
}



.blog_category_wrap{
margin: auto;
text-align: center;
width:100%;
max-width:400px;
}
.blog_category_wrap li.current{
border-bottom:1px solid #000;
}


/*一覧*/
.flex-box{
flex-wrap:wrap;
}
.blog_contents_wrap{
box-sizing: border-box;
width: calc(100% / 3);
}

.blog_text, .blog_date{
font-size:1.2rem;
box-sizing: border-box;
padding:10px;
}
@media(max-width:768px) {
.blog_contents_wrap{
padding:8px;
width:50%;
}
}
@media(max-width:414px) {
.blog_contents_wrap{
width:100%;
}
}


.bg-berge{
background:#EFEBEC;
padding:5vw;
margin-bottom:5vw;
box-sizing: border-box;
}
.bg-berge ul{
width:70%;
margin: 0 auto;
text-align: left;
}
@media(max-width:768px) {
.bg-berge ul{
width:89%;
}
}
.bg-berge ul li{
line-height: 3;
list-style-type: decimal;
}
.bg-berge ul li a{
font-weight:normal;
color:#000;
}

.bg-green{
background:#E9EFED;
padding:1vw;
margin-bottom:5vw;
box-sizing: border-box;
}

.main-content__innner p{
margin-bottom:1em;
}

.blog_category{
color:#fff;
background-color:#000;
padding:0;
width: 90px;
font-size: 1.3rem;
position: relative;
text-align: center;
z-index: 999;
top: 6%;
left: 3%;
}

.blog_category p{
margin: 0;
height: 25px;
position: relative;
}

.blog_category a{
color:#fff;
}

.blog_image{
width:auto;
height:auto;
margin-bottom: 11px;
margin-right: auto;
margin-left: auto;
box-sizing: border-box;
padding:10px;
}

.blog_contents_wrap a img{
width: 100%;
max-width: 400px;
height: 100%;
min-height: 306px;
}
@media(max-width:768px) {
.blog_category{
/*left: 13%;*/
}
}

@media(max-width:414px) {
.blog_category{
/*left: 10%;*/
}
}
/*アマゾン　ショップ*/
.amazon_shop_wrap{
border:1px solid #000;
border-top: 2px solid #f90;
padding:0 2vw 2vw;
width:100%;
max-width:380px;
margin:auto;
display: block;
}
.amazon_shop_wrap .amazon_title_wrap{
width: 100%;
max-width: 100px;
margin: auto;
padding-top: 0.7vw;
}
.amazon_shop_img{
width:80%;
max-width:100px;
margin:auto;
}
.amazon_shop_img　img{
width:100%;
}

.amazon_shop_text{
width:80%;
max-width:400px;
margin:auto;
}


