/* ===============================
Width
=============================== */

.mw960{
 max-width:960px;
 margin:auto;
}

.mw860{
 max-width:860px;
 margin:auto;
}

.mw760{
 max-width:760px;
 margin:auto;
}


/* ===============================
Alignment
=============================== */

.center,
.post_content table td.center{
 text-align:center;
 margin-left:auto;
 margin-right:auto;
}

.left-t{
 text-align:left;
}

.right-t{
 text-align:right;
}

.center-t{
 text-align:center;
}

.just{
 text-align:justify;
}

.cb{
 clear:both;
}


/* ===============================
Flexbox Masonry レイアウト
=============================== */

.flexbox2{
 display:grid;
 grid-template-columns:45% 45%;
 grid-column-gap:3.125rem;
 grid-row-gap:1.875rem;
 justify-items:stretch;
 align-items:stretch;
}


/* 3 column */

.flexbox{
 display:grid;
 grid-template-columns:30% 30% 30%;
 grid-column-gap:2.5rem;
 grid-row-gap:2.5rem;
 justify-items:stretch;
 align-items:stretch;
}


/* 2 column */

.flexbox1{
 display:grid;
 grid-template-columns:60% 30%;
 grid-column-gap:1.25rem;
 grid-row-gap:1.25rem;
 justify-items:stretch;
 align-items:stretch;
}


/* 4 column */

.flexbox4{
 display:grid;
 grid-template-columns:23% 23% 23% 23%;
 grid-column-gap:1.59375rem;
 grid-row-gap:2.1875rem;
 justify-items:stretch;
 align-items:stretch;
}


.flexbox4 .fb-title{
 font-size:1.35rem;
 font-weight:700;
 letter-spacing:.2em;
}

.flexbox4 .fb-nickname{
 font-size:1.1rem;
 letter-spacing:.15em;
 font-weight:700;
 color:#165e83;
}


/* ===============================
Items
=============================== */

.fb-item{
 position:relative;
}

.fb-item img{
 width:100%;
 display:block;
 transition:all .8s;
}


.fb-title{
 text-align:center;
 width:100%;
 margin:0;
 margin-bottom:0.625rem!important;
 font-size:1.35rem;
 font-weight:700;
 padding:0.875rem 0 0.625rem 0;
 border-bottom:dotted 1px #999;
 border-top:dotted 1px #999;
}

.fb-nickname{
 text-align:left;
 width:100%;
 padding:0 0 0.625rem 0;
 margin:0;
 margin-bottom:0.125rem!important;
 font-size:1.05rem;
 font-weight:600;
}

.fb-setsumei{
 text-align:left;
 width:100%;
 margin:0;
 line-height:1.6;
 padding:0;
 font-size:1rem;
 text-shadow:
 0 0 1px #fff,
 0 0 2px #fff,
 0 0 3px #fff,
 0 0 4px #fff,
 0 0 5px #fff,
 0 0 6px #fff,
 0 0 7px #fff,
 0 0 8px #fff;
}


/* ===============================
Image
=============================== */

.fb-item2 img{
 width:100%;
 display:block;
 transition:all .8s;
 border-radius:0.25rem;
}


/* ===============================
Detail
=============================== */

.fb-item-in{
 width:100%;
 margin-top:1.25rem;
 margin-bottom:1.875rem;
 float:left;
}

.fb-item-in dt,
.fb_kougo-text dd{
 text-align:left;
}

.fb-item-in dl{
 margin-bottom:1.875rem;
}

.fb-item-in dt{
 font-weight:500;
 margin-bottom:0.5rem;
 font-size:1.35rem;
 color:#84b548;
}

.fb-item-in dd{
 font-weight:400;
 text-align:left;
 line-height:1.65;
 margin-bottom:0.6rem;
 font-size:1rem!important;
 padding-left:1.25rem;
}


/* ===============================
Tablet
=============================== */

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

.flexbox4{
 grid-template-columns:30% 30% 30%;
 grid-column-gap:1.59375rem;
 grid-row-gap:1.25rem;
}

}


/* ===============================
739px〜480px
=============================== */

@media screen and (max-width:739px) and (min-width:480px){

.flexbox2{
 grid-template-columns:100%;
}

.fb-title{
 font-size:1rem;
 line-height:1.5;
}

.fb-nickname{
 font-weight:600;
 line-height:1.5;
}

.fb-setsumei{
 font-size:0.85rem;
 line-height:1.5;
}

.fb-item{
 width:100%;
}

.flexbox,
.flexbox4{
 grid-template-columns:45% 45%;
}

.flexbox4 .fb-nickname{
 font-size:1.2rem;
}

.flexbox4 #staff dt{
 float:none;
 font-weight:700;
}

.flexbox4 #staff dd{
 margin:0 0 0.625rem 1.75rem;
 padding:0;
 font-size:1rem;
}

}


/* ===============================
スマホ
=============================== */

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

.flexbox{
 grid-template-columns:100%;
}

.flexbox .fb-item img{
 max-width:350px;
 text-align:center;
 margin:auto;
}

}