@charset "utf-8";
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    text-decoration: none;
    list-style: none;
}
.cf:after {
  content: "";
  clear: both;
  display: block;
}
body {
    font-size: 100%;
    line-height: 1.5;
    letter-spacing: 0.03em;
    font-family:-apple-system,BlinkMacSystemFont,"Helvetica Neue","游ゴシック Medium",YuGothic,YuGothicM,"Hiragino Kaku Gothic ProN",メイリオ,Meiryo,sans-serif;
}
a {
    color: rgb(231, 127, 128);
    display: block;
}
a:hover {
    color: #d08905;
    transition: .1s;
}
h1,h2,h3,h4,h5,h6{
    line-height: 1.2;
    font-weight: normal;
}
h2,h3,h4,h5,h6{
    margin-bottom: 25px;
}
h2 {
    color: #8fb7b5;
    padding: 10px 0;
    font-size: 240%;
    line-height: 1;
}
h3{
    border-left: 5px solid rgb(231, 127, 128);
    padding-left: 10px;
}
h4{
    border-bottom: 2px solid rgb(231, 127, 128);
    padding-bottom: 5px;
}
h5{
    color: rgb(231, 127, 128);
    font-size: 120%;
}
h6{
    color: rgb(231, 127, 128);
    font-size: 100%;
}

article ul{
    margin: 1.5em 0;
}
article ul li{
    position:relative;
    border-bottom: 1px solid #ccc;
    padding: 10px 0;
    list-style: disc;
}
article ol{
    counter-reset: counter-name;
    background: rgba(143, 183, 181, 0.28);
    padding: 0.5em 0 0.5em 1.5em;
    margin: 1.5em 0;
}
article ol li{
    margin: 0;
    list-style: none;
    position: relative;
    padding-left: 20px;
}
article ol li:before {
    counter-increment: counter-name;
    content: counter(counter-name) ".";
    position: absolute;
    left: 0;
}
blockquote {
    background: #eee;
    padding: 3em 1em;
    position: relative;
}
blockquote:before,
blockquote:after{
    font-size: 600%;
    line-height: 0em;
    color: #dd4b39;
    position: absolute;
}
blockquote:before {
    content: "“";
    left: 0;
    top: 0;
    line-height: 1em;
}
blockquote:after {
    content: "”";
    right: 0;
    bottom: 0;
}
table {
    border-collapse: collapse;
    text-align: left;
    line-height: 1.5;
    margin-bottom: 20px;
    background: #fff;
}
table th {
    width: 150px;
    padding: 10px;
    font-weight: bold;
    vertical-align: top;
    border: 1px solid #ccc;
    background: #8fb7b5;
    color: #fff;
}
table td {
    width: 350px;
    padding: 10px;
    vertical-align: top;
    border: 1px solid #ccc;
}
pre {
    white-space: -moz-pre-wrap; /* Mozilla */
    white-space: -pre-wrap;     /* Opera 4-6 */
    white-space: -o-pre-wrap;   /* Opera 7 */
    white-space: pre-wrap;      /* CSS3 */
    word-wrap: break-word;      /* IE 5.5+ */
    display: inline-block;
    border: 3px solid #eee;
    margin: 1em 0;
    padding: 1em;
}
strong, b {
    font-size: 100%;
}
em{
    font-style: normal;
}
del {
    text-decoration: line-through;
}
ins {
    display: inline-block;
}
.alignleft {
    text-align: left;
}
.aligncenter {
    text-align: center;
}
.alignright {
    text-align: right;
}

/* wrap */
.frametop{
    background: url(../images/bk_1.jpg)repeat-x 0 0;
    height: 2rem;
}
.frametop {
    width: 100%;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 100;
}
.framebottom{
    background: url(../images/bk_1.jpg)repeat-x 0 0;
    height: 2rem;
}
.framebottom {
    width: 100%;
    position: fixed;
    bottom: 0;
    left: 0;
    z-index: 100;
}
.frameleft,
.frameright{
    width: 2rem;
    height: 100vh;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 100;
    background: url(../images/bk_1.jpg) repeat-y 0 0;
}
.frameright {
    left: inherit;
    right: 0;
}
.wrapin{
    background: #fff;
    padding: 5rem 0 0;
}
/* Menu */
.h_area {
    position: fixed;
    top: 3rem;
    left: -0.5rem;
    z-index: 1000;
}
#g_nav-menu li{
    margin-bottom: 5px;
}
#g_nav-menu li a {
    min-width: 205px;
    color: #fff;
    padding: 15px 10px 15px 45px;
    background: rgba(222, 66, 66, .7);
    border-radius: 0 5px 5px 0;
    display: block;
    position: relative;
}
#g_nav-menu li:first-child a{
    background: rgba(222, 66, 66, 1);
}
#g_nav-menu li a:after{
    content: "\f054";
    font-family: FontAwesome;
    position: absolute;
    left: 25px;
    top: 29%;
}
#g_nav-menu li:first-child a:after{
    content: "\f015";
    font-family: FontAwesome;

}
#g_nav-menu li a:hover{
    background:  rgba(143, 183, 181, 0.83);
}
.slicknav_menu {
    display: none;
}

.mv{
    position: relative;
    margin-bottom: 5rem;
}
.sitettla{
    width: 600px;
    position: absolute;
    top: 5rem;
    left: 18rem;
    background: rgba(255, 255, 255, 0.49);
    padding: 2rem;
    border-radius: 20px;
    z-index: 1;
}
.sitettla h1 a{
    color: #242424;
    font-size: 300%;
}
.sitettla h1{
    padding-bottom: 1rem;
    border-bottom: 1px solid #242424;
    margin-bottom: 1rem;
    text-shadow: 0 0 5px #fff;
}
.sitettla .c_copy{
    padding: 1rem;
    text-shadow: 0 0 5px #fff;
    line-height: 1.2;
}
/* slider */
.bx-wrapper {
    margin: 0 auto;
    border: none;
    box-shadow: none;
}
.bx-viewport {
    border-radius: 30px;
}
.bx-wrapper .bx-prev{
    left: 3rem;
}
.bx-wrapper .bx-next{
    right: 3rem;
}
.bx-wrapper .bx-controls-direction{
    position: relative;
}
.bx-wrapper .bx-controls-direction a{
    position: absolute;
     top: 0;
     margin-top: 5px;
    outline: 0;
     text-indent: 0;
    z-index: 9999;
}
.bx-wrapper .bx-pager.bx-default-pager a{
    background: #eee;
}
.bx-wrapper .bx-pager.bx-default-pager a:hover, .bx-wrapper .bx-pager.bx-default-pager a.active, .bx-wrapper .bx-pager.bx-default-pager a:focus{
    background: rgb(231, 127, 128)
}
/* contents area */
.morebtn {
    text-align: center;
}
.morebtn a{
    width: 100%;
    background: #999;
    padding: 3px 3rem;
    color: #fff;
    display: inline-block;
    border-radius: 5px;
}
.morebtn a:hover{
    background: #8fb7b5;
}
/* main */
.content_1,
.link-wrap,
.link-cont_wrap,
.sub-menu{
    padding: 1rem 20rem;
}
/* おすすめリンク */
.link-wrap{
    padding: 5rem 16rem 3rem;
    background: rgba(218, 196, 194, 0.18);
}
.link-wrap h2{
    color: rgb(231, 127, 128);
    text-align: center;
}
.link-wrap h3 a {
    display: block;
}
.link-wrap a {
    text-align: left;
}
.link-in {
    margin-bottom: 1rem;
}
article.link-wrap h3 {
    background: #fff;
    padding: 1rem;
    border-left: none;
    border-radius: 25px;
    margin-bottom: 0;
}
/*下層リンク部分*/
.link-cont_wrap{
    padding: 5rem 12rem 3rem;
/*    background: url(../images/bk_1.jpg) 0 0;*/
    background: rgb(216, 207, 200);
    display: -webkit-flex;
    display: flex;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;
    justify-content: space-around;
}
article.link-cont{
    width: 31%;
    background: #fff;
    padding: 20px;
    border-radius: 25px;
}
article.link-cont h2{
    font-size: 140%;
    margin-bottom: 0;
}
article.link-cont p {
    padding: 1rem 0;
    border-top: 1px solid #d8cec8;
    border-bottom: 1px solid #d8cec8;
    margin-bottom: 1rem;
}
article img{
    max-width: 100%;
    margin-bottom: 10px;
}
.link-cont img{
    width: 100%;
}



/* aside */
.sub-menu {
    border-top: 3px solid #f7f2ef
}
.sub-menu li > div {
    color: #8fb7b5;
    font-size: 21px;
    border-bottom: 1px solid #8fb7b5;
}
.sub-menu a{
    padding: 10px 0;
}
.sub-menu img {
    float: left;
    max-width: 180px;
    margin-right: 10px;
    border-radius: 5px;
}
.submenu-link a {
    margin-bottom: 10px;
}
.sidecontainer >li {
    width: 45%;
    margin: 1%;
}
ul.sidecontainer {
    display: -webkit-flex;
    display: flex;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;
    justify-content: space-around;
}
/* footer */
footer {
    position: relative;
    background: rgb(231, 127, 128);
    color: #fff;
    padding: 1rem 16rem 3rem;
}
footer p{
    font-size: 21px
}
footer a{
    color: #fff;
    font-size: 85%;
}
footer a:hover{
    color: #fff;
    text-decoration: underline;
}
footer >ul {
    display: flex;
    flex-wrap: wrap;
    margin-bottom: 30px
}
.footer-copy {
    font-size: 70%;
    text-align: center;
}
.to_top_btn {
    background: rgba(231, 127, 128, 0.7);
    padding: 1rem;
    text-align: center;
}
.to_top_btn  a{
    color: #fff
}
.footer-menu {
    width: 25%;
    margin-right: 3%;
}
/* under */
.notfound{
    font-size: 200%;
    color: #dd4b39;
}
.subpage_img{
    text-align: center;
    }
/* pan nav */
.panav{
    margin-bottom: 10px;
    border-bottom: 1px solid #e77f80;
    border-top: 1px solid #e77f80;
}
.panav a {
    display: inline;
    font-size: 85%;
}
.panav font{
    color: #ccc;
}
/* SNS */
.button-area {
    width: 100%;
    margin: 1rem
        0;
}
.sns-container {
    display: flex;
    justify-content: space-between;
}
.button-area >div{
text-align: center;}
.button-area:after {
    content: '';
    clear: both;
    display: block;
}
.title-fill {
    text-align: center;
    display: block;
    background-color: #444;
    color: #fff;
    font-size: 14px;
    width: 100%;
    padding: 6px 15px;
    margin-bottom: 10px;
    box-sizing: border-box;
}
.button-whole {
    width: 23%;
    box-sizing: border-box;
    margin: 0 0.1%;
    position: relative;
}

.button-whole .fa{
    font-weight: bold;}
.button-link {
    display: block;
    text-align: center;
    color: #fff !important;
    font-size: 14px !important;
    padding: 10px 0 !important;
    box-sizing: border-box;
    text-decoration: none;
}

/* SNSごとの背景色 */

#twitter {
    border-radius: 5px;
    background-color: #00acee;
    box-shadow: 0 3px 0 #008dc3;
}
#hatena {
    border-radius: 5px;
    background-color: #2D4C86;
    box-shadow: 0 3px 0 #102855;
}
#facebook {
    border-radius: 5px;
    background-color: #3b5998;
    box-shadow: 0 3px 0 #1B3D82;
}
#ggl-plus {
    border-radius: 5px;
    background-color: #dd4b39;
    box-shadow: 0 3px 0 #b12312;
}
#twitter:hover,
#hatena:hover,
#facebook:hover,
#ggl-plus:hover{
    box-shadow: 0 0 0;
    top: 3px;
    position: relative;
}
.wrapin_inner {
    padding: 0 16rem 0;
}
.subpage .sitettla{
    width: 100%;
    position: inherit;
    padding: 2rem 8rem;
}
.sitettla h1{
     margin-bottom: 0;
}
.subpage .sitettla h1 a{
    font-size: 180%;
}
.subpage .sub-menu{
    padding: 0;
}
.notfoundwrap{
    margin: 2rem 0;
}
@media screen and (max-width: 950px) {
    .sitettla {
        width: 100%;
        position: initial;
        background: none;
        padding: 0 3rem;
    }
    #g_nav-menu{
        display: none;
    }
    .slicknav_menu {
        display: block;
        padding: 0;
        background: rgba(222, 66, 66, .7);
        position: fixed;
        z-index: 999;
        top: 31px;
    }
    .slicknav_menu .slicknav_icon{
        display: none;
    }
    .slicknav_menu .slicknav_menutxt {
        color: #fff;
        font-weight: bold;
        text-shadow: 0 0 0 #000;
        padding: 1rem 2rem;
    }
    .slicknav_nav ul {
        margin: 0;
    }
    .slicknav_menu a {
        padding: 0;
        margin: 0;
    }
    a.slicknav_btn.slicknav_collapsed {
        width: 100%;
        display: block;
    }
    .slicknav_menu img {
        display: block;
        margin: 20px auto 0;
        width: 100%;
        height: auto;
    }
    .slicknav_btn {
        float: none;
        background-color: #fff;
    }
    .slicknav_nav .slicknav_row:hover {
        border-radius: 0;
        background: none;
    }
    ul.slicknav_nav li:last-child {
        border-bottom: none;
    }
    /* side menu */
    .slicknav_menu .slicknav_no-text{
        float: right;
        margin: 15px;
    }
    .slicknav_nav a{
        color: #dd4b39;
        padding: 1rem 3rem;
        background: rgba(247, 242, 239, 0.8);
    }
    .slicknav_nav a:hover {
        -webkit-border-radius: 0px;
        -moz-border-radius: 0px;
        border-radius: 0px;
        background: rgba(255, 255, 255, 0);
        color: #fff;
    }
    .sitettla h1 a,
    .subpage .sitettla h1 a{
        font-size: 5vw;
    }
    .wrapin{
        padding: 6rem 0 0;
    }
    .wrapin_inner{
        padding: 0 3rem 0;
    }

}
@media screen and (max-width: 724px) {
    .frameleft, .frameright {
        width: 15px;
    }
    .content_1, .link-wrap, .link-cont_wrap, .sub-menu,
    .wrapin_inner,.subpage .sitettla{
        padding: 1rem 20px;
    }
    .link-wrap{
        padding: 5rem 20px 3rem;
    }
    .link-cont_wrap{
        padding: 2rem 30px 2rem;
    }
    article.link-cont {
        width: 100%;
        margin-bottom: 11px;

    }
    h1,h2,h3,h4,h5,h6{
        text-align: left;
    }
    main h2,
    .side-menu h2 {
        padding: 15px 5%;
    }
    .container,
    main,
    .side-menu,
    .submenu-link img,
    article img,
    .sidecontainer >li{
        width: 100%;
    }
    article img,
    .sub-menu img{
        max-width: 100%;
    }
    article img,
    main,
    .submenu-link img {
        float: none;
    }
    .sns-container{
        display: block;
    }
    .sitettl {
        font-size: 100%;
    }
    main h2,
    .side-menu h2 {
        font-size: 6vw;
    }
    footer {
        padding: 1rem 20px;
    }
    footer .footer-menu {
        width: 100%;
        margin-bottom: 2rem
    }
    .sidecontainer p a {
        height: 28px;
        padding: 0;
        text-align: center;
    }
    .link-cont img{
        float: none;
        display: block;
        margin: 0 auto;
    }
    .morebtn{
        text-align: center;
    }
    .morebtn a {
        display: block;
        max-width: 340px;
        margin: 0 auto;
    }
    /* g_nav */
    .side-menu h2 {
        display: none;
    }
    /* sns */
    .button-whole {
        display: block;
        width: 48%;
        float: left;
        margin: 1%;
    }
    footer >ul{
        display: initial;
    }
    .subpage .wrapin {
        padding: 4rem 0 0;
    }
}