/****
* Theme Name: ys theme4
* Author: yuka
* Description: オリジナルテーマ
* Version: 1.0
***/

/****
* 基本構造のcss
***/
html {
    font-family: "游ゴシック体", "游ゴシック", YuGothic, "Yu Gothic", "ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, sans-serif;
    font-size: 62.5%; /* 1rem=10px 1.6rem=16px */
    font-weight: 500;
}
body {
    font-size: 1.6rem;
    line-height: 2.2;
    width: 100%;
    max-width: 100%;
    margin: 0;
    padding: 0;
    color: rgba(0,0,0,0.78);
}
img {
    vertical-align: bottom;
    max-width: 100%;
    height: auto;
}
a {
    text-decoration: none;
    color: rgba(0,0,0,0.9);
}
.single .entry a,
.category .entry a,
.archive .entry a,
.blog .entry a {
    border-bottom: 1px solid #222;
}
.single h1 a, .single h2 a, .single h3 a, .single h4 a, .single h5 a,
.category h1 a, .category h2 a, .category h3 a, .category h4 a, .category h5 a,
.archive h1 a, .archive h2 a, .archive h3 a, .archive h4 a, .archive h5 a,
.blog h1 a, .blog h2 a, .blog h3 a, .blog h4 a, .blog h5 a,
.blog .entry a.more-link {
    border-bottom: 0px solid #222;
}
h1 {
    font-size: 3rem;
    line-height: 1.5;
    font-weight: bold;
    color: rgba(0,0,0,0.9);
}
h2 {
    font-size: 2.6rem;
    line-height: 1.5;
    font-weight: bold;
    color: rgba(0,0,0,0.9);
}
@media screen and (max-width: 767px) {
    h2 {
        font-size: 2.3rem;
    }
}
h3 {
    font-size: 2.2rem;
    line-height: 1.3;
    font-weight: bold;
    color: rgba(0,0,0,0.9);
}
@media screen and (max-width: 767px) {
    h3 {
        font-size: 2rem;
    }
}
h4 {
    font-size:  1.8rem;
    line-height: 1.3;
    font-weight: bold;
    color: rgba(0,0,0,0.9);
}
h5 {
    font-size: 1.6rem;
    line-height: 1.3;
    font-weight: bold;
    color: rgba(0,0,0,0.9);
}
.midashi {
    font-size: 4rem
}
.sub-midashi {
    font-size: 2.6rem;
    line-height: 1.4;
}
@media screen and (max-width: 767px){
    .midashi {
        font-size: 3.4rem;  
    }
    .sub-midashi {
        font-size: 2.4rem;
    }
}
/**
* 404ページ
*/
.error404 {
    margin-top: 160px;
    margin-bottom: 160px;
    padding: 0 30px;
}
/**
* wordpressで斜体になる文字リセット
*/
i, cite, em, var, address,dfn {
    font-style: normal;
}
ul {
    list-style-type: none;
}
/**
* コンテンツ内
*/
#container-box { /* ヘッダーメニュー分下げる */
    margin-top: 64px;
    overflow: hidden;
}
#container-flex { /* 2カラムの時はこちら */
    width: 1200px;
    max-width: 90%;
    margin: 0 auto;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}
@media screen and (max-width: 767px) {
    #container-flex { /* モバイルでは1カラムに */
        width: 86%;
        max-width: 86%;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
    }
}
/**
* メインコンテンツ
*/
#main {
    margin: 0;
}
#main-flex { /* 2カラムの時はこちら */
    -ms-flex-preferred-size: 700px;
    flex-basis: 700px;
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    padding: 20px;
}
@media screen and (max-width: 767px) {
    #main-flex {
    padding: 0;
}
}
.entry p {
    margin: 1em 0;
}
#main .entry-title,
#main-flex .entry-title,
.blog-entry-title .entry-title{ /* 記事タイトル */
    font-size: 2.8rem;
    line-height: 1.2;
    border-bottom: 1px solid #ccc;
    border-top: none;
    border-right: none;
    border-left: none;
    padding: 0.1em 0.5em 0.1em 0;
}
.blog-entry-title,
.content-area.blog-entry-title {
    margin: 2em auto;
    text-align: center;
}
/* アーカイブ表示 */
.archive-entry-title { /* アーカイブ表示時の記事タイトル */
    font-size: 2rem;
    font-weight: bold;
    border-bottom: 1px solid #ccc;
    color: rgba(0,0,0,0.9);
}
.archive-entry {
    font-size: 1.4rem;
}
#main-flex article {
    margin-top: 30px;
    margin-bottom: 40px;
}
article aside {
    font-size: 1.2rem;
    text-align: right;
    margin: 0.5em 0 1em 0;
}
.single article aside {
    margin: 0.5em 0 3em 0;
}
.blog-entry-title aside {
    font-size: 1.2rem;
    text-align: center;
    margin: 1em;
}
article aside .fas,
.blog-entry-title aside .fas {
    padding: 0 1px 0 6px;
}
/**
* 前の記事 次の記事
*/
.paging {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    margin: 5em 0;
}
.paging .prev {
    -webkit-box-flex:1;
    -ms-flex-positive:1;
    flex-grow:1;
    text-align: left;
}
.paging .prev a {
    border-left: 15px solid #ddd;
    background-color: #f0f0f0;
    padding: 0.2em 0.5em;
    margin-right: 2em;
    display: inline-block;
    width: 85%;
}
.paging .next {
    -webkit-box-flex:1;
    -ms-flex-positive:1;
    flex-grow:1;
    text-align: right;
}
.paging .next a {
    border-right: 15px solid #ddd;
    background-color: #f0f0f0;
    padding: 0.2em 0.5em;
    margin-left: 2em;
    display: inline-block;
    width: 85%;
}
/**
* サイドバー
*/
#sidebar-flex {
    -ms-flex-preferred-size: 300px;
    flex-basis: 300px;
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    padding: 20px;
    font-size: 1.4rem;
}
#sidebar-flex section {
    margin-top: 30px;
}
#sidebar-flex ul {
    list-style-type: none;
    margin-left: 10px;
}
.widget-title {
    font-size: 1.6rem;
    border-bottom: 1px solid #ddd;
    margin: 10px 0;
}
.widget-area .post-date {
    font-size: 1.0rem;
}
#wp-calendar {
    width: 95%;
    height: auto;
}
#wp-calendar tbody {
    text-align: center;
}
.screen-reader-text {
    display: none;
}
input, select, textarea {
    font-size: 1.3rem;
    padding: 4px;
    border: solid 1px #ddd;
    width: 100%;
}
[type="submit"] {
    font-size: 1.3rem;
    padding: 4px 10px;
    border: solid 1px #ddd;
    width: auto;
}
.widget-area label {
    background: #fff;
}
.widget_archive {
    position: relative;
}
.widget_archive::before {
    content: "";
    width: 0;
    height: 0;
    border: 7px solid transparent;
    border-top: 10px solid #ccc;
    position: absolute;
    top: 76%;
    right: 10px;
    margin: -2px 0 0 0;
}
.widget_archive select {
    width: 100%;
    max-width: 100%;
    padding: 2px 10px;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    border: 1px solid #ddd;
    background-color: none;
}
/**
* ヘッダー
*/
.header-fix-cover {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 64px;
    z-index: 100;
    background: #fff;
    padding: 0 20px;
}
.header-fix-cover header a,
.header-description {
    text-decoration: none;
    color: rgba(0,0,0,0.78);
}
.header-description {
    font-size: 1.3rem;
    line-height: 1.2;
}
@media screen and (max-width: 1020px) {
    .header-description {
        display: none;
    }
}
.header-fix {
    width: 1200px;
    max-width: 90%;
    margin: 0 auto;
}
@media screen and (max-width: 415px) {
    .header-fix {
        width: 100%;
        max-width: 100%;
    }
}
.header-left {
    float: left;
    display:-webkit-box;
    display:-ms-flexbox;
    display:flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    height: 64px;
}
.header-right {
    float: right;
    padding: 0;
}
.site-title {
    font-size: 3rem;
    font-weight: bold;
    width: 200px;
    color: rgba(0,0,0,0.9);
    line-height: 0;
    margin-right: 10px;
}
@media screen and (max-width: 415px) {
    .site-title {
        font-size: 2.3rem;
    }
}
/**
* PC用上部メニュー
*/
.top-menu {
    font-size: 1.3rem;
}
/* 親メニュー */
.top-menu-pc ul {
    height: 64px;
    list-style-type: none;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}
.top-menu-pc ul li {
    position: relative; /* 子メニューのabsoluteのため */
    float: left;
    margin: 0 0.4em;
    padding: 0;
}
.top-menu-pc ul li a {
    display: block;
    margin: 0;
    padding: 0.4em 0.8em;
    background: #fff;
    color: rgba(0,0,0,0.9);
}
/* 子メニュー */
.top-menu-pc ul li ul { /* 縦に並べる */
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    background: #fff;
    padding: 0;
    width: 200px; /* 子・孫メニューの横幅 */
    height: auto;
    position: absolute; /* 親メニューのrelativeの下にくっつける */
    top: 100%;
}
.top-menu-pc ul li ul li {
    width: 100%;
    margin: 0 0;
    color: rgba(0,0,0,0.9);
}
.top-menu-pc ul > li > ul > li,
.top-menu-pc ul > li > ul > li > ul > li { /* 最初非表示 */
    overflow: hidden;
    height: 0;
    padding: 0 0;
    opacity: 0; /* 以下表示アニメーション */
    -webkit-transition: .3s;
    transition: .3s;
}
.top-menu-pc ul > li:hover > ul > li,
.top-menu-pc ul > li > ul > li:hover > ul > li{ /* マウスオーバーで表示 */
    overflow: visible;
    height: 2.3em;
    padding: 2em 0;
    line-height: 1.6;
    opacity: 1; /* 表示アニメーション */
    display:-webkit-box;
    display:-ms-flexbox;
    display:flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}
.top-menu-pc ul > li > ul > li a,
.top-menu-pc ul > li > ul > li > ul > li a{
    -webkit-box-flex: 0;
    -ms-flex: 0 1 auto;
    flex: 0 1 auto;
}
/* 孫メニュー */
.top-menu-pc li ul li ul {
    top: 0;
    left: 100%; /* 子メニューの右側に表示 */
    width: 100%;
}
.top-menu-pc li:last-child ul li ul,
.top-menu-pc li:nth-last-child(2) ul li ul { /* 最後と最後から2番目のメニューの孫を左側に表示 */
    left: -100%;
    width: 100%;
}
/* メニュー前後の矢印 */
.top-menu-pc li ul li ul:before { /* 孫メニューの前 */
    position: absolute;
    content: "\f10b";
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    top: 17px;
    margin-left: -20px;
    color: rgba(0,0,0,0.5);
}
.top-menu-pc li:last-child ul li ul:before,
.top-menu-pc li:nth-last-child(2) ul li ul:before { /* 最後と最後から2番目のメニューの孫メニューの前 */
    position: absolute;
    content: "\f10b";
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    top: 17px;
    left: 200%;
    margin-left: -20px;
    color: rgba(0,0,0,0.5);
}
.top-menu-pc li ul li:hover ul:before { /* 孫メニューの前・マウスオーバー時 */
    position: absolute;
    content: "\f109";
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    top: 17px;
    margin-left: -20px;
    color: rgba(0,0,0,0.5);
}
.top-menu-pc li:last-child ul li:hover ul:before,
.top-menu-pc li:nth-last-child(2) ul li:hover ul:before { /* 最後と最後から2番目のメニューの孫メニューの前・マウスオーバー時 */
    position: absolute;
    content: "\f108";
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    top: 17px;
    left: 200%;
    margin-left: -20px;
    color: rgba(0,0,0,0.5);
}
li[class~="menu-item-has-children"] a:after { /* 子があるメニューの後ろ */
    content: "\f10b";
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    margin-left: 3px;
    color: rgba(0,0,0,0.5);
}
@media screen and (max-width: 850px) {
    li[class~="menu-item-has-children"] a:after {
        content: "";
    }
}
li[class~="menu-item-has-children"] ul a:after {
    content: "";
}
.sub-menu li a:before { /* 子・孫メニューの前 */
    content: "\f109";
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    margin-left: 5px;
    margin-right: 5px;
    color: rgba(0,0,0,0.5);
}
.top-menu-mobile { /* モバイル用メニュー非表示 */
    display: none;
}
/**
* モバイル用上部メニュー
*/
.menu-button { /* ハンバーガーメニューの位置 */
    display: block;
    text-align: right;
    margin: 0 0 0 0;
    padding: 10px 0 0 0;
    line-height: 1;
}
.menu-button1 { /* ハンバーガーメニュー */
    font-size: 3rem;
}
.menu-button1 .fa-times {
    padding-right: 3px;
}
.menu-button2 { /* ハンバーガーメニュー下の文字 */
    font-size: 1rem;
}
.menu-button a { /* ハンバーガーメニューの色 */
    color: rgba(0,0,0,0.9);
}
/* スライドインメニュー */
#slide-menu {
    position: fixed;
    top: 0;
    right: -280px;
    width: 280px;
    height: 100%;
    background: #F9F9F9;
    z-index: 20;
}
#slide-menu-inner {
    height: 100%;
    overflow: auto;
    padding: 0 20px 50px 0;
}
.header-fix-cover header #slide-menu a {
    color: rgba(0,0,0,0.9);
}
/* スライドインメニュー内部 */
@media screen and (max-width: 1020px) {
    .top-menu-pc {/* PCメニュー非表示 */
        display: none;
    }
    .top-menu-mobile {
        display: inherit;
    }
    .top-menu-mobile .menu a {
        color: rgba(0,0,0,0.9);
    }
    nav ul {/* 縦に並べる */
        background-color: none;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-box-pack: start;
        -ms-flex-pack: start;
        justify-content: flex-start;
        -webkit-box-align: start;
        -ms-flex-align: start;
        align-items: flex-start;
        -ms-flex-wrap: nowrap;
        flex-wrap: nowrap;
        list-style-type: none;
        margin: 0 0 0 1.5em;
    }
    nav ul ul {/* 縦に並べる　サブメニュー */
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-box-pack: start;
        -ms-flex-pack: start;
        justify-content: flex-start;
        -webkit-box-align: start;
        -ms-flex-align: start;
        align-items: flex-start;
        background: none;
        -webkit-box-shadow: none;
        box-shadow: none;
        padding: 0;
        -webkit-transition: 0;
        transition: 0;
        width: auto;
        height: auto;
    }
    .top-menu-mobile li a {
        display: block;
        margin: 0 2px;
        padding: 0.3em 0;
        position: relative;
    }
    .top-menu-mobile li ul a {
        margin-right: 0.6em;
    }
}
/**
* フッター
*/
footer {
    margin: 0 auto;
    padding: 20px 0;
    background: #f9f9f9;
    font-size: 1.4rem;
    position: relative;
    left: 0;
    width: 100%;
}
footer .footer-area {
    width: 100%;
    max-width: 100%;
    text-align: left;
    margin: 0 auto;
}
/****
* レイアウト関係
***/
/**
* 左右余白ありのコンテンツエリア
*/
.content-area,
.content-area2 {/* 1カラムの基本コンテンツエリア */
    width: 1200px;
    max-width: 90%;
    margin: 0 auto;
    padding: 0;
}
@media screen and (max-width: 767px) {
    .content-area {
        width: 86%;
        max-width: 86%;
    }
    .content-area2 {
        width: 100%;
        max-width: 100%;
    }
}
/**
* 横幅調整
*/
.content-w80per {/* 横幅80% */
    width: 80%;
    margin: 0 auto;
}
.content-w70per {/* 横幅70% */
    width: 70%;
    margin: 0 auto;
}
.content-w60per {/* 横幅60% */
    width: 60%;
    margin: 0 auto;
}
.content-w50per {/* 横幅50% */
    width: 50%;
    margin: 0 auto;
}
@media screen and (max-width: 1023px) {
    .content-w70per,
    .content-w60per,
    .content-w50per {
        width: 80%;
        margin: 0 auto;
    }
}
@media screen and (max-width: 767px) {
    .content-w80per,
    .content-w70per,
    .content-w60per,
    .content-w50per {
        width: 86%;
        margin: 0 auto;
    }
    .content-area .content-w80per,
    .content-area .content-w70per,
    .content-area .content-w60per,
    .content-area .content-w50per {
        width: 100%;
    }
}
/****
* コンテンツの上にbox
***/
.img-contents-cover {
    position: relative;
}
.img-contents-cover.black-filter:before{
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    display: block;
    width: 100%;
    height: 100%;
    background-color: rgba(0,0,0,0.24);
    z-index: 2;
}
.img-contents-inner {
    position: absolute;
    top: 50%;
	left: 50%;
	-webkit-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
    width: 1200px;
    max-width: 86%;
    margin: 0 auto;
    padding: 0;
    color: rgba(255,255,255,0.78);
    z-index: 3;
}
@media screen and (max-width: 767px){
    .img-contents-inner {
        width: 86%;
        max-width: 86%;
        padding: 25px 0;
    }
}
.img-contents-inner h2 {
    color: rgba(255,255,255,0.9);
}
.catch-copy {
    font-size: 4rem;
}
@media screen and (max-width: 767px){
    .catch-copy {
        font-size: 2.6rem;
    }
}
.img-contents-100fit { /* 画像全画面fit */
    width: 100%;
    max-width: 100vw;
    height: calc(100vh - 64px);
    background-size: cover;
    background-position: center center;
}
/****
* 画像の上にbox モバイルで画像の下にbox
***/
.img-contents-cover2 {
    position: relative;
}
.img-contents-cover2.black-filter:before{
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    display: block;
    width: 100%;
    height: 100%;
    background-color: rgba(0,0,0,0.24);
    z-index: 2;
}
.img-contents-inner2 {
    position: absolute;
    top: 50%;
	left: 50%;
	-webkit-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
    width: 100%;
    z-index: 3;
}
.img-contents-inner2 h2 {
    color: rgba(255,255,255,0.9);
}
@media screen and (max-width: 767px){
    .img-contents-cover2 .img-contents-100fit {
        height: calc(60vh - 64px);
    }
    .img-contents-cover2.black-filter:before{
        background-color: rgba(0,0,0,0);
    }
    .img-contents-inner2 {
        position: relative;
        left: 0;
        top: 0;
        -webkit-transform: translate(0,0);
        transform: translate(0,0);
        width: 100%;
        padding: 25px 0;
    }
    .img-contents-inner2 h2 {
        color: rgba(0,0,0,0.9);
    }
}
/**
* flexでグリッドレイアウト
*/
/* flexコンテナ */
.content-area .flex-box {
    margin: 0 -15px 0 -15px;
}
@media screen and (max-width: 767px) {
    .content-area .flex-box {
        margin: 0 0 0 0;
}
}
.content-area .flex-box.nomargin {
    margin: 0 0 0 0;
}
.flex-box { /* flexコンテナ。基本(左から右並び) */
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
}
.flex-box-reverse { /* flexコンテナ。逆順(右から左並び) */
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: reverse;
    -ms-flex-direction: row-reverse;
    flex-direction: row-reverse;
}
@media screen and (max-width: 767px) {
    .flex-box,
    .flex-box-reverse { /* モバイルでは縦並び */
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
    }
}
.flex-box-vertical { /* flexコンテナ。縦並び */
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
}
.flex-box-nowrap { /* flexコンテナ。改行無し */
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
}
.flex-center { /* flexコンテナに追加。天地左右中央揃え */
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}
.justify-center {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}
/* flexアイテム */
.flex-box > div,
.flex-box-reverse > div,
.flex-box-vertical > div,
.flex-box-nowrap > div {
    padding: 15px 15px 15px 15px;
}
.flex-box-vertical.vertical-gallery > div:first-child {
    padding: 0 0 15px 0;
}
.flex-box-vertical.vertical-gallery > div {
    padding: 15px 0 15px 0;
}
.flex-box-vertical.vertical-gallery > div:last-child {
    padding: 15px 0 0 0;
}
.flex-box.nomargin > div,
.flex-box-reverse.nomargin > div,
.flex-box-vertical.nomargin > div,
.flex-box-nowrap.nomargin > div,
.flex-box-vertical.vertical-gallery.nomargin > div:first-child,
.flex-box-vertical.vertical-gallery.nomargin > div,
.flex-box-vertical.vertical-gallery.nomargin > div:last-child {
    padding: 0 0 0 0;
}
@media screen and (max-width: 767px) {
    .flex-box > div,
    .flex-box.nomargin > div,
    .flex-box-reverse > div,
    .flex-box-reverse.nomargin > div,
    .flex-box-vertical > div,
    .flex-box-vertical.nomargin > div,
    .flex-box-nowrap > div,
    .flex-box-vertical.vertical-gallery.nomargin > div {
        padding: 15px 0 25px 0;
    }
    .flex-box-vertical.vertical-gallery.nomargin > div:first-child {
        padding: 0 0 25px 0;
    } 
    .flex-box-vertical.vertical-gallery.nomargin > div:last-child {
        padding: 15px 0 0 0;
    }
    .flex-box.nomargin.fitimg > div,
    .flex-box-reverse.nomargin.fitimg > div,
    .flex-box-vertical.nomargin.fitimg > div,
    .flex-box-nowrap.nomargin.fitimg > div,
    .flex-box-vertical.vertical-gallery.nomargin.fitimg  > div:first-child,
    .flex-box-vertical.vertical-gallery.nomargin.fitimg  > div,
    .flex-box-vertical.vertical-gallery.nomargin.fitimg  > div:last-child {
        padding: 0 0 0 0;
    }
}
.nomargin img { /* 余白なしでは画像を横幅いっぱいに */
    min-width: 100%;
}
.nomargin.img-logo img { /* 画像横幅100%解除 */
    min-width: auto;
}
/* 枠付き */
.content-area .flex-box.flex-waku,
.content-area .flex-box.flex-waku2 {
    margin: 0 0 0 0;
}
@media screen and (max-width: 767px) {
    .content-area .flex-box.flex-waku,
    .content-area .flex-box.flex-waku2 {
        margin: 0 0 0 0;
}
}
.flex-waku > div,
.flex-waku2 > div {
    padding: 1.4em;
}
.flex-waku > div.flex-onefourth {
    padding: 1em;
}
.flex-box.flex-waku > div {
    margin: 15px 15px 15px 15px;
}
.flex-box.flex-waku > div:first-child {
    margin: 15px 15px 15px 0;
}
.flex-box.flex-waku > div:last-child {
    margin: 15px 0 15px 15px;
}
@media screen and (max-width: 767px) {
    .flex-box.flex-waku > div,
    .flex-box.flex-waku > div:first-child,
    .flex-box.flex-waku > div:last-child {
        margin: 15px 0 15px 0;
    }
}
 /* 枠付き横長 */
.flex-waku-wide {
    padding: 1.4em;
}
.flex-box.flex-waku-wide > div:first-child,
.flex-box-reverse.flex-waku-wide > div:last-child,
.flex-box-vertical.flex-waku-wide > div:first-child {
    margin: 0em 1em 0em 0em;
}
.flex-box.flex-waku-wide > div:last-child,
.flex-box-reverse.flex-waku-wide > div:first-child,
.flex-box-vertical.flex-waku-wide > div:last-child {
    margin: 0em 0em 0em 1em;
}
/* Full(1) 横幅いっぱい */
.flex-full {
    -ms-flex-preferred-size: 10px;
    flex-basis: 10px;
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
}
/* One-Half(1/2) box2つ並び */
.flex-onehalf {
    -ms-flex-preferred-size: calc( 100% / 2 );
    flex-basis: calc( 100% / 2 );
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
}
/* One-Third(1/3) box3つ並び,Two-Third(2/3)と組み合わせてbox2つ並び */
.flex-onethird {
    -ms-flex-preferred-size: calc( 100% / 3 );
    flex-basis: calc( 100% / 3 );
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
}
/* Two-Third(2/3) One-Third(1/3)と組み合わせてbox2つ並び */
.flex-twothird {
    -ms-flex-preferred-size: calc( 100% / 3 * 2 );
    flex-basis: calc( 100% / 3 * 2 );
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
}
/* One-Fourth(1/4) box4つ並び */
.flex-onefourth {
    -ms-flex-preferred-size: calc( 100% / 4 );
    flex-basis: calc( 100% / 4 );
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
}
/* One-Fifth(1/5) box5つ並び */
.flex-onefifth {
    -ms-flex-preferred-size: calc( 100% / 5 );
    flex-basis: calc( 100% / 5 );
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
}
/* (1/3)(2/3)をレスポンシブで(1/2)に */
.flex-onethird-m {
    -ms-flex-preferred-size: calc( 100% / 3 );
    flex-basis: calc( 100% / 3 );
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
}
.flex-twothird-m {
    -ms-flex-preferred-size: calc( 100% / 3 * 2 );
    flex-basis: calc( 100% / 3 * 2 );
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
}
@media screen and (max-width: 1023px){
    .flex-onethird-m,
    .flex-twothird-m {
        -ms-flex-preferred-size: calc( 100% / 2 );
        flex-basis: calc( 100% / 2 );
    }
}
@media screen and (max-width: 767px) {
    .flex-full,
    .flex-onehalf,
    .flex-onethird,
    .flex-twothird,
    .flex-onefourth,
    .flex-onefifth,
    .flex-onethird-m,
    .flex-twothird-m {
        width: 100%;
        -ms-flex-preferred-size: auto;
        flex-basis: auto;
    }
    .flex-box-nowrap .flex-onehalf {
        -ms-flex-preferred-size: calc( 100% / 2 );
        flex-basis: calc( 100% / 2 );
    }
    .flex-box-nowrap .flex-onethird {
        -ms-flex-preferred-size: calc( 100% / 3 );
        flex-basis: calc( 100% / 3 );
    }
    .flex-box-nowrap .flex-twothird {
        -ms-flex-preferred-size: calc( 100% / 3 * 2 );
        flex-basis: calc( 100% / 3 * 2 );
    }
    .flex-box-nowrap .flex-onefourth {
        -ms-flex-preferred-size: calc( 100% / 4 );
        flex-basis: calc( 100% / 4 );
    }
    .flex-box-nowrap .flex-onefifth {
        -ms-flex-preferred-size: calc( 100% / 5 );
        flex-basis: calc( 100% / 5 );
    }
}
/****
* flexボタン下揃え
***/
.flex-button { 
    display: -webkit-box; 
    display: -ms-flexbox; 
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
}
.flex-button .flex-button-bottom {
    margin-top: auto;
}
/****
* 枠線 モバイルで枠全表示
***/
.border-waku { /* 全部(左上) */
    border: 1px solid #ddd;
}
.border-waku-c { /* 全部 真ん中box */
    border-top: 1px solid #ddd;
    border-right: 1px solid #ddd;
    border-bottom: 1px solid #ddd;
}
.border-waku-r { /* 全部 右box */
    border-top: 1px solid #ddd;
    border-right: 1px solid #ddd;
    border-bottom: 1px solid #ddd;
}
.border-waku-lb { /* 全部 左下box */
    border-right: 1px solid #ddd;
    border-bottom: 1px solid #ddd;
    border-left: 1px solid #ddd;
}
.border-waku-cb { /* 全部 真ん中の下box */
    border-right: 1px solid #ddd;
    border-bottom: 1px solid #ddd;
}
.border-waku-rb { /* 全部 右下box */
    border-right: 1px solid #ddd;
    border-bottom: 1px solid #ddd;
}
@media screen and (max-width: 767px) {
    .border-waku-c,
    .border-waku-r,
    .border-waku-lb,
    .border-waku-cb,
    .border-waku-rb {
        border-top: 0px solid #ddd;
        border-right: 1px solid #ddd;
        border-bottom: 1px solid #ddd;
        border-left: 1px solid #ddd;
    }
}
/**
* 余白制御
*/
.lh-0 {/* line heightを0に */
    line-height: 0!important;
}
.p-0 p,
p.p-0 {/* 勝手に入るpを消す時 */
    margin: 0 0!important;
    height: 0!important;
}
.p-1 p,
p.p-1 {/* 勝手に入るpを消したあと元に戻す */
    margin: 1em 0!important;
    height: auto!important;
}

/* margin topとbottom */
.mt0em {
    margin-top: 0!important;
}
.mb0em {
    margin-bottom: 0!important;
}
.mt05em {
    margin-top: 0.5em!important;
}
.mb05em {
    margin-bottom: 0.5em!important;
}
.mt1em {
    margin-top: 1em!important;
}
.mb1em {
    margin-bottom: 1em!important;
}
.mt2em {
    margin-top: 2em!important;
}
.mb2em {
    margin-bottom: 2em!important;
}
.mt3em {
    margin-top: 3em!important;
}
.mb3em {
    margin-bottom: 3em!important;
}
.mt4em {
    margin-top: 4em!important;
}
.mb4em {
    margin-bottom: 4em!important;
}
.mt5em {
    margin-top: 5em!important;
}
.mb5em {
    margin-bottom: 5em!important;
}
.mt6em {
    margin-top: 6em!important;
}
.mb6em {
    margin-bottom: 6em!important;
}
.mt7em {
    margin-top: 7em!important;
}
.mb7em {
    margin-bottom: 7em!important;
}
.mt8em {
    margin-top: 8em!important;
}
.mb8em {
    margin-bottom: 8em!important;
}
.mt9em {
    margin-top: 9em!important;
}
.mb9em {
    margin-bottom: 9em!important;
}
.mt10em {
    margin-top: 10em!important;
}
.mb10em {
    margin-bottom: 10em!important;
}
/* margin leftとright */
.ml0 {
    margin-left: 0!important;
}
.mr0 {
    margin-right: 0!important;
}
.ml1em {
    margin-left: 1em!important;
}
.mr1em {
    margin-right: 1em!important;
}
.ml2em {
    margin-left: 2em!important;
}
.mr2em {   
    margin-right: 2em!important;
}
.ml3_5em {
    margin-left: 3.5em!important;
}
.mr3_5em {   
    margin-right: 3.5em!important;
}
/* padding topとbottom */
.pt0 {
    padding-top: 0!important;
}
.pb0 {
    padding-bottom: 0!important;
}
.pt05em {
    padding-top: 0.5em!important;
}
.pb05em {
    padding-bottom: 0.5em!important;
}
.pt1em {
    padding-top: 1em!important;
}
.pb1em {
    padding-bottom: 1em!important;
}
.pt2em {
    padding-top: 2em!important;
}
.pb2em {
    padding-bottom: 2em!important;
}
.pt3em {
    padding-top: 3em!important;
}
.pb3em {
    padding-bottom: 3em!important;
}
.pt4em {
    padding-top: 4em!important;
}
.pb4em {
    padding-bottom: 4em!important;
}
.pt5em {
    padding-top: 5em!important;
}
.pb5em {
    padding-bottom: 5em!important;
}
/* padding leftとright */
.pl0 {
    padding-left: 0!important;
}
.pr0 {
    padding-right: 0!important;
}
.pl1em {
    padding-left: 1em!important;
}
.pr1em {
    padding-right: 1em!important;
}
.pl2em {
    padding-left: 2em!important;
}
.pr2em {
    padding-right: 2em!important;
}
/**
* 文字関係
*/
.center {
    text-align: center;
}
.left {
    text-align: left;
}
.right {
    text-align: right;
}
.fw-bold {
    font-weight: bold;
}
/**
* ページ内リンクずれ解消
*/
.inlink {
    margin-top: -76px;
    padding-top: 76px;
}
/**
* リンク下線
*/
.link-bottom {
    border-bottom: 1px solid #222;
}
/****
* PCのみ表示
***/
.onlyPC {
    display: block !important;
}
@media screen and (max-width: 767px){
    .onlyPC {
        display: none !important;
    }
}
/****
* スマホのみ表示
***/
.onlySP {
    display: none !important;
}
@media screen and (max-width: 767px){
    .onlySP {
        display: block!important;
    }
}