/*
Theme Name: Flat-management v26 Theme
Theme URI: https://www.flat-management.jp
Description: Designed by ML Design
Version: 26.02
Author: ML Design
Author URI: https://www.ml-design.jp/
Tags:
*/

@font-face {
  font-family: 'icomoon';
  src:  url('fonts/icomoon.eot?tbb36n');
  src:  url('fonts/icomoon.eot?tbb36n#iefix') format('embedded-opentype'),
    url('fonts/icomoon.ttf?tbb36n') format('truetype'),
    url('fonts/icomoon.woff?tbb36n') format('woff'),
    url('fonts/icomoon.svg?tbb36n#icomoon') format('svg');
  font-weight: normal;
  font-style: normal;
  font-display: block;
}

[class^="icon-"], [class*=" icon-"] {
  /* use !important to prevent issues with browser extensions that change fonts */
  font-family: 'icomoon' !important;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;

  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon-icon_menu:before {
  content: "\e906";
}
.icon-home:before {
  content: "\e90a";
}
.icon-arrow-left2:before {
  content: "\e901";
}
.icon-arrow-up2:before {
  content: "\e902";
}
.icon-arrow-right2:before {
  content: "\e903";
}
.icon-arrow-down2:before {
  content: "\e904";
}
.icon-facebook:before {
  content: "\e913";
}
.icon-instagram:before {
  content: "\e914";
}
.icon-x:before {
  content: "\e917";
}


* {
    margin: 0px;
    padding: 0px;
}
html, body {
  overflow-x: hidden;
}
html {
    font-size: 62.5%; /*10px*/
}
body {
    font-family: YakuHanJPs, MyYuGothicM, "游ゴシック Medium", "Yu Gothic Medium", 游ゴシック体, YuGothic, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", メイリオ, Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
    padding-top: 0px;
    padding-right: 0;
    padding-bottom: 0px;
    padding-left: 0;
    margin: 0;
    background-color: #062c35; /* adjust to the drawer */
}
a:hover {
    color: #FF6600;
}
a {
    transition: 0.3s;
}

/* reset */
img {
    border-top-width: 0px;
    border-right-width: 0px;
    border-bottom-width: 0px;
    border-left-width: 0px;
    border-top-style: none;
    border-right-style: none;
    border-bottom-style: none;
    border-left-style: none;
}
a:hover img {
    filter: alpha(opacity=80);
    opacity: 0.8;
    -moz-opacity: 0.8;

    /* transform */
    -webkit-transform: translate(1px,1px);
    -moz-transform: translate(1px,1px);
    -ms-transform: translate(1px,1px);
    -o-transform: translate(1px,1px);
    transform: translate(1px,1px);
}
h1, h2, h3, h4, h5, h6 {
    margin: 0px;
    padding: 0px;
}
p, pre, em {
    margin: 0px;
    padding: 0px;
}
ul, dl, ol, li, dt, dd {
    margin: 0px;
    padding: 0px;
    list-style-type: none;
}

/* text */
.alignright {
    float: right;
}
.alignleft {
    float: left;
}
img.alignleft {
    margin-right: 8px;
    margin-bottom: 8px;
}
img.alignright {
    margin-left: 8px;
    margin-bottom: 8px;
}
.aligncenter {
    text-align: center;
}
.float_right {
    float: right;
    margin-left: 10px;
}
.float_left {
    float: left;
    margin-right: 10px;
}
.clear {
    margin: 0px;
    padding: 0px;
    clear: both;
}
.post-edit-link {
    font-size: 13px;
    font-weight: bold;
    color: #FF0000;
    display: block;
    clear: both;
    text-decoration: none;
    border: 1px dashed #CCCCCC;
    text-align: center;
    padding-top: 5px;
    padding-bottom: 5px;
    background-color: #F0F0F0;
}

/* html5 */
section, hgroup, nav, header, footer, section, article, aside {
    margin: 0px;
    padding: 0px;
    display: block;
}

/* color */
.red{
    color: #FF0000;
}
.orange {
    color: #c11a1a;
}
.blue{
    color: #0000FF;
}
.green {
    color: #006600;
}


/* searchform */
.searchform_area {
    font-size: 12px;
    padding-top: 13px;
    padding-bottom: 5px;
    color: #333333;
    padding-left: 20px;
}
#searchform {
    margin: 0px;
    padding: 0px;
}
#searchsubmit {
    font-size: 12px;
}
#s {
    font-size: 13px;
}


/* form */
.column_a {
    float: none;
    width : 100%;
    font-size: 1.5rem;
    border-top-style: solid;
    border-top-width: 1px;
    border-top-color: #CCCCCC;
    padding-top: 15px;
    padding-bottom: 0px;
}
.column_b {
    float: none;
    width : 100%;
    font-size: 1.5rem;
    padding-top: 15px;
    padding-bottom: 0px;
    border-top-style: none;
    border-top-width: 1px;
    border-top-color: #CCCCCC;
}
@media only screen and (min-width: 680px) and (max-width: 999px) { /* 680-999 */
    .column_a {
        float: left;
        width : calc(30% / 1 - 10px);
        font-size: 1.7rem;
    }
    .column_b {
        float: right;
        width : calc(70% / 1);
        font-size: 1.7rem;
        border-top-style: solid;
    }
}
@media only screen and (min-width: 1000px) and (max-width: 1400px) { /* 1000-1400 */
    .column_a {
        float: left;
        width : calc(30% / 1 - 10px);
        font-size: 1.8rem;
    }
    .column_b {
        float: right;
        width : calc(70% / 1);
        font-size: 1.8rem;
        border-top-style: solid;
    }
}
@media only screen and (min-width: 1400px) { /* 1400over */
    .column_a {
        float: left;
        width : calc(30% / 1 - 10px);
        font-size: 1.9rem;
    }
    .column_b {
        float: right;
        width : calc(70% / 1);
        font-size: 1.9rem;
        border-top-style: solid;
    }
}


/* mw_wp_form */
.mw_wp_form {
    padding-right: 0px;
    padding-left: 0px;
    text-align: left;
}
.mw_wp_form .error {
    font-size: 110%;
    color: #FFF;
    display: block;
    padding-left: 5px;
    padding-top: 5px;
    padding-bottom: 5px;
    margin-bottom: 5px;
    overflow: hidden;
    width: 100%;
    font-weight: bold;
    background-color: #ff6060;
    border-radius: 10px;
}
.required_text {
    color: #FF0000;
}
.column_b textarea {
    width: 98%;
    font-size: 1.7rem;
    border-radius: 10px;
    border-style: solid;
    border-color: #a3a3a3;
    margin-top: 5px;
    margin-bottom: 5px;
    margin-left: 5px;
    padding-top: 5px;
    padding-bottom: 5px;
    padding-left: 5px;
}
.column_b span.green {
    clear: both;
    display: block;
}
.column_a input,
.column_b input,
.column_b select {
    font-size: 1.7rem;
    border-radius: 5px;
    border-style: solid;
    border-color: #a3a3a3;
    border-width: 1px;
    margin-top: 5px;
    margin-bottom: 5px;
    margin-left: 5px;
    padding-top: 5px;
    padding-bottom: 5px;
    padding-left: 5px;
}
.column_c {
    padding-top: 15px;
    padding-bottom: 10px;
    text-align: center;
    clear: both;
}
.column_b small {
    font-size: 12px;
    color: #999999;
}
.contact_submit_button {
    text-align: center;
    padding-top: 15px;
    padding-bottom: 5px;
}
.column_c input,
.contact_submit_button input {
    font-size: 1.8rem;
    padding-top: 5px;
    padding-bottom: 5px;
    padding-right: 10px;
    padding-left: 10px;

    border-radius: 5px;
    border-style: solid;
    border-color: #332828;
    border-width: 3px;
    filter: drop-shadow(0px 0px 2px rgba(0,0,0,0.4));
}
.required_text {
    color: #FF0000;
    font-size: 90%;
}
.form_example {
    font-size: 90%;
    color: #999999;
}
.mwform-checkbox-field {
    background-color: #CCCCCC!important;
    margin-bottom: 8px;
    display: block;
    float: left;
    padding-top: 3px;
    padding-right: 4px;
    padding-bottom: 3px;
    padding-left: 2px;
    margin-right: 10px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
}
.mwform-tel-field {
    display: block;
    width: 100%;
}
.mwform-tel-field input {
    width: 90px!important;
}
.addr01 input {
    width: 90%!important;
}

/* wp-pagenavi */
.wp-pagenavi {
    clear: both;
    margin-top: 15px;
    margin-bottom: 15px;
    overflow: hidden;
    margin-right: 10px;
    margin-left: 10px;
}
.wp-pagenavi span,
.wp-pagenavi a {
    font-size: 1.8rem!important;
    display: block;
    float: left;
    padding-right: 8px!important;
    padding-left: 8px!important;
}
.wp-pagenavi span {
    background-color: #CCCCCC;
    color: #FFFFFF;
}
.wp-pagenavi a {
    color: #FFFFFF;
    background-color: #2689b5;
}


/* block */
#wrapper {
    width: calc(100% - 5px);
    padding-right: 5px;
    transition: 0.5s;
}
#upper_block {
    margin: 0px;
    width: 100%;
    padding-top: 0px;
    padding-right: 0px;
    padding-bottom: 0px;
    padding-left: 0px;
    position: relative;
    background-color: #fff; /* adjust to the drawer */
}
#upper_block_inner {
    width: 100%;
    text-align: left;
    margin-top: 0px;
    margin-right: auto;
    margin-bottom: 0px;
    margin-left: auto;
    overflow: hidden;
    padding-top: 0px;
    padding-right: 0px;
    padding-bottom: 15px;
    padding-left: 0px;
}
#middle_block {
    margin: 0px;
    width: 100%;
    padding-top: 0px;
    padding-right: 0px;
    padding-bottom: 0px;
    padding-left: 0px;
    margin-top: 1px;
    margin-bottom: 1px;
    margin-left: 0;
    margin-right: 0;
    background-color: #fff; /* adjust to the drawer */
}
#middle_block_inner {
    text-align: left;
    width: 100%;
    margin-right: auto;
    margin-left: auto;
    padding-top: 0px;
    padding-right: 0px;
    padding-bottom: 15px;
    padding-left: 0px;
    overflow: hidden;
}
#under_block {
    margin: 0px;
    padding: 0px;
    width: 100%;
    background-color: #fff; /* adjust to the drawer */
}
#under_block_inner {
    text-align: left;
    width: 100%;
    margin-top: 0px;
    margin-right: auto;
    margin-bottom: 0px;
    margin-left: auto;
    padding-top: 0px;
    padding-right: 0px;
    padding-bottom: 0px;
    padding-left: 0px;
}
@media only screen and (min-width: 680px) and (max-width: 999px) { /* 680-999 */
    #upper_block_inner {
        width: 100%;
        padding-top: 0px;
    }
    #middle_block_inner {
        width: 100%;
    }
    #under_block_inner {
        width: 100%;
    }
}
@media only screen and (min-width: 1000px) and (max-width: 1400px) { /* 1000-1400 */
    #upper_block_inner {
        width: 1000px;
        padding-top: 0px;
    }
    #middle_block_inner {
        width: 1000px;
    }
    #under_block_inner {
        width: 100%;
    }
}
@media only screen and (min-width: 1400px) { /* 1400over */
    #upper_block_inner {
        width: 1200px;
        padding-top: 0px;
    }
    #middle_block_inner {
        width: 1200px;
    }
    #under_block_inner {
        width: 100%;
    }
}


/* entry */
.entry {
    margin: 0px;
    clear: both;
    padding-top: 15px;
    padding-right: 10px;
    padding-bottom: 15px;
    padding-left: 10px;
    overflow: hidden;
}
.entry p {
    font-size: 1.5rem;
    line-height: 2.8rem;
    padding-bottom: 15px;
    padding-right: 5px;
    padding-left: 5px;
    transition: 0.6s;
}
.entry h1,
#top_news_area_sub h1 {
    font-family: 'ヒラギノ明朝 Pro W3', 'Hiragino Mincho Pro', '游明朝','Yu Mincho', '游明朝体', 'YuMincho','ＭＳ Ｐ明朝', 'MS PMincho', serif, sans-serif;
    font-size: 2.1rem;
    padding-top: 3px;
    padding-bottom: 8px;
    clear: both;
    color: rgb(2, 107, 126);
    text-align: center;
    margin-bottom: 15px;
    transition: 0.6s;
}
.entry h2 {
    font-size: 2rem;
    padding-top: 18px;
    padding-bottom: 8px;
    clear: both;
    color: rgb(2, 107, 126);
    transition: 0.6s;
    text-align: center;
    border-top-style: solid;
    border-top-width: 1px;
    border-top-color: #ccc;
    margin-top: 10px;
}
.entry h3 {
    font-size: 1.8rem;
    padding-top: 6px;
    padding-bottom: 15px;
    clear: both;
    color: #e47a43;
}
.entry h4 {
    font-size: 1.7rem;
    padding-top: 5px;
    padding-bottom: 15px;
    clear: both;
}
.entry h5 {
    font-size: 1.5rem;
    padding-top: 5px;
    padding-bottom: 15px;
    clear: both;
}
.entry ul {
    padding-top: 5px;
    padding-bottom: 15px;
    padding-left: 10px;
}
.entry li::before {
    content:"■ ";
}
.entry li {
    font-size: 1.8rem;
    line-height: 3rem;
    padding-left: 35px;
    padding-bottom: 3px;
    border-bottom-width: 1px;
    border-bottom-style: dotted;
    border-bottom-color: #006668;
    padding-top: 2px;
}
.entry ul li ul {
    padding-left: 20px;
}
.entry dl {
    padding-top: 5px;
    padding-bottom: 15px;
    padding-left: 14px;
    padding-right: 15px;
}
.entry dt {
    font-size: 2rem;
    font-weight: bold;
    line-height: 3rem;
    margin-bottom: 3px;
    margin-top: 5px;
    padding-left: 5px;
}
.entry dd {
    font-size: 1.8rem;
    padding-left: 35px;
    padding-bottom: 3px;
    border-bottom-width: 1px;
    border-bottom-style: dotted;
    border-bottom-color: #006668;
    padding-top: 2px;
    background-image: url(image/base/dot1.svg);
    background-position: 5px center;
    background-repeat: no-repeat;
    background-size: 8px;
}
.entry em {
    font-size: 120%;
    font-style: normal;
    font-weight: bolder;
    color: #3399CC;
}
.entry table {
    width: 100%;
    border-top-width: 1px;
    border-left-width: 1px;
    border-top-style: solid;
    border-left-style: solid;
    border-top-color: #CCCCCC;
    border-left-color: #CCCCCC;
}
.entry td,
.entry th {
    padding: 3px;
    border-bottom-width: 1px;
    border-bottom-style: solid;
    border-bottom-color: #CCCCCC;
    border-right-width: 1px;
    border-right-style: solid;
    border-right-color: #CCCCCC;
    font-size: 1.5rem;
}
.entry time {
    font-size: 1.6rem;
    color: #666666;
    display: block;
    padding-top: 15px;
    padding-bottom: 15px;
    padding-left: 10px;
}
@media only screen and (min-width: 680px) and (max-width: 999px) { /* 680-999 */
    .entry p {
        font-size: 1.8rem;
        line-height: 3rem;
        padding-bottom: 15px;
        padding-right: 5px;
        padding-left: 5px;
    }
    .entry h1 {
        font-size: 3.1rem;
        padding-top: 6px;
        padding-bottom: 8px;
        margin-bottom: 15px;
    }
    .entry h2 {
        font-size: 2.4rem;
        padding-top: 18px;
        padding-bottom: 8px;
        text-align: left;
    }
    .entry h3 {
        font-size: 2rem;
        padding-top: 6px;
        padding-bottom: 15px;
    }
    .entry h4 {
        font-size: 1.7rem;
        padding-top: 5px;
        padding-bottom: 15px;
    }
    .entry h5 {
        font-size: 1.5rem;
        padding-top: 5px;
        padding-bottom: 15px;
    }
    .entry ul {
        padding-top: 5px;
        padding-bottom: 15px;
        padding-left: 34px;
    }
    .entry li {
        font-size: 1.7rem;
        line-height: 3rem;
        margin-bottom: 3px;
    }
    .entry ul li ul {
        padding-left: 20px;
    }
    .entry dl {
        padding-top: 5px;
        padding-bottom: 15px;
        padding-left: 34px;
        padding-right: 45px;
    }
    .entry dt {
        font-size: 1.7rem;
        line-height: 3rem;
        margin-bottom: 3px;
        margin-top: 5px;
        padding-left: 5px;
    }
    .entry dd {
        font-size: 1.7rem;
        padding-left: 35px;
        padding-bottom: 3px;
        padding-top: 2px;
    }
    .entry td,
    .entry th {
        font-size: 1.6rem;
    }
}
@media only screen and (min-width: 1000px) and (max-width: 1400px) { /* 1000-1400 */
    .entry p {
        font-size: 2rem;
        line-height: 3.4rem;
        padding-bottom: 15px;
        padding-right: 5px;
        padding-left: 5px;
    }
    .entry h1 {
        font-size: 3.5rem;
        padding-top: 6px;
        padding-bottom: 8px;
        margin-bottom: 15px;
    }
    .entry h2 {
        font-size: 2.5rem;
        padding-top: 18px;
        padding-bottom: 8px;
        text-align: left;
    }
    .entry h3 {
        font-size: 2rem;
        padding-top: 6px;
        padding-bottom: 15px;
    }
    .entry h4 {
        font-size: 1.7rem;
        padding-top: 5px;
        padding-bottom: 15px;
    }
    .entry h5 {
        font-size: 1.5rem;
        padding-top: 5px;
        padding-bottom: 15px;
    }
    .entry ul {
        padding-top: 5px;
        padding-bottom: 15px;
        padding-left: 34px;
    }
    .entry li {
        font-size: 2rem;
        line-height: 3rem;
        margin-bottom: 3px;
    }
    .entry ul li ul {
        padding-left: 20px;
    }
    .entry dl {
        padding-top: 5px;
        padding-bottom: 15px;
        padding-left: 34px;
        padding-right: 45px;
    }
    .entry dt {
        font-size: 2rem;
        line-height: 3rem;
        margin-bottom: 3px;
        margin-top: 5px;
        padding-left: 5px;
    }
    .entry dd {
        font-size: 1.8rem;
        padding-left: 35px;
        padding-bottom: 3px;
        padding-top: 2px;
    }
    .entry td,
    .entry th {
        font-size: 1.7rem;
    }
}
@media only screen and (min-width: 1400px) { /* 1400over */
    .entry p {
        font-size: 2.1rem;
        line-height: 3.4rem;
        padding-bottom: 15px;
        padding-right: 5px;
        padding-left: 5px;
    }
    .entry h1 {
        font-size: 4rem;
        padding-top: 6px;
        padding-bottom: 8px;
        margin-bottom: 15px;
    }
    .entry h2 {
        font-size: 3rem;
        padding-top: 18px;
        padding-bottom: 8px;
        text-align: left;
    }
    .entry h3 {
        font-size: 2rem;
        padding-top: 6px;
        padding-bottom: 15px;
    }
    .entry h4 {
        font-size: 1.7rem;
        padding-top: 5px;
        padding-bottom: 15px;
    }
    .entry h5 {
        font-size: 1.5rem;
        padding-top: 5px;
        padding-bottom: 15px;
    }
    .entry ul {
        padding-top: 5px;
        padding-bottom: 15px;
        padding-left: 34px;
    }
    .entry li {
        font-size: 2rem;
        line-height: 3rem;
        margin-bottom: 3px;
    }
    .entry ul li ul {
        padding-left: 20px;
    }
    .entry dl {
        padding-top: 5px;
        padding-bottom: 15px;
        padding-left: 34px;
        padding-right: 45px;
    }
    .entry dt {
        font-size: 2rem;
        line-height: 3rem;
        margin-bottom: 3px;
        margin-top: 5px;
        padding-left: 5px;
    }
    .entry dd {
        font-size: 1.8rem;
        padding-left: 35px;
        padding-bottom: 3px;
        padding-top: 2px;
    }
    .entry td,
    .entry th {
        font-size: 1.8rem;
    }
}


/* history_back */
.history_back {
    clear: both;
    margin-top: 5px;
    margin-bottom: 5px;
}
.history_back a {
    font-size: 1.8rem;
    display: block;
    margin-left: auto;
    margin-right: auto;
    display: block;
    width: 200px;
    padding-top: 3px;
    padding-bottom: 3px;
    text-align: center;
    background-color: #ccc;
    color: #FFFFFF;
    text-decoration: none;
}
.history_back a:hover {
    color: #f60;
}


/* scroller */
#scroller {
    position: fixed;
    z-index: 999;
    right: 5px;
    bottom: 10px;
}
#scroller a {
    font-size: 2.2rem;
    color: #FFFFFF;
    display: block;
    background-color: #062c35;
    width: 40px;
    height: 40px;
    text-align: center;
    text-decoration: none;
    border-top-left-radius: 5px;
    border-bottom-left-radius: 5px;
}
#scroller a:hover {
    color: #FF6600;
}
#scroller span {
    padding-top: 8px;
    display: block;
}


/* sl */
#sl {
    height: 320px;
    width: 100%;
    position: relative;
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    overflow: hidden;
}
#sub_theme {
    height: 190px;
    width: 100%;
    position: relative;
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
}
@media only screen and (min-width: 700px) and (max-width: 789px) { /* 700-789 */
    #sl {
        height: 350px;
    }
    #sub_theme {
        height: 210px;
    }
}
@media only screen and (min-width: 790px) and (max-width: 999px) { /* 790-999 */
    #sl {
        height: 380px;
    }
    #sub_theme {
        height: 250px;
    }
}
@media only screen and (min-width: 1000px) and (max-width: 1400px) { /* 1000-1400 */
    #sl {
        height: 500px;
    }
    #sub_theme {
        height: 270px;
    }
}
@media only screen and (min-width: 1400px) { /* 1400over */
    #sl {
        height: 540px;
    }
    #sub_theme {
        height: 290px;
    }
}


/* theme */
.theme_top {
    background-image: url(image/sl/sl_01c.jpg);
}
.theme_plan1 {
    background-image: url(image/sl/sl_05.jpg);
}
.theme_plan2 {
    background-image: url(image/sl/sl_07.jpg);
}
.theme_plan3 {
    background-image: url(image/sl/sl_06.jpg);
}
.theme_blog {
    background-image: url(image/sl/sl_02.jpg);
}
.theme_review {
    background-image: url(image/sl/sl_08.jpg);
}
.theme_company {
    background-image: url(image/sl/sl_09.jpg);
}
.theme_all {
    background-image: url(image/sl/sl_01.jpg);
}


/* cautch */
#cautch {
    position: absolute;
    width: 100%;
    height: auto;
    text-align: center;
    top: 40px;
    z-index: 9;
    color: #fff;
    filter: drop-shadow(0 0px 3px rgba(0, 0, 0, 0.9));
    font-family: 'ヒラギノ明朝 Pro W3', 'Hiragino Mincho Pro', '游明朝','Yu Mincho', '游明朝体', 'YuMincho','ＭＳ Ｐ明朝', 'MS PMincho', serif, sans-serif;
    font-size: 2.8rem;
    font-weight: bold;
}
@media only screen and (min-width: 700px) and (max-width: 789px) { /* 700-789 */
    #cautch {
        font-size: 3.2rem;
        top: 50px;
    }
}
@media only screen and (min-width: 790px) and (max-width: 999px) { /* 790-999 */
    #cautch {
        font-size: 3.6rem;
        top: 60px;
    }
}
@media only screen and (min-width: 1000px) and (max-width: 1400px) { /* 1000-1400 */
    #cautch {
        font-size: 4.0rem;
        top: 70px;
    }
}
@media only screen and (min-width: 1400px) { /* 1400over */
    #cautch {
        font-size: 4.5rem;
        top: 80px;
    }
}


/* logo_base */
#logo_base {
    width: 100%;
    background-color: #fff;
}
#logo_base_inner {
    width: calc(100% - 20px);
    height: 100px;
    padding-top: 10px;
    margin-left: 10px;
    margin-right: 10px;
    overflow: hidden;
    position: relative;
}
@media only screen and (min-width: 700px) and (max-width: 789px) { /* 700-789 */
    #logo_base_inner {
        width: calc(100% - 20px);
        height: 110px;
        margin-left: 10px;
        margin-right: 10px;
    }
}
@media only screen and (min-width: 790px) and (max-width: 999px) { /* 790-999 */
    #logo_base_inner {
        width: calc(100% - 20px);
        height: 120px;
        margin-left: 10px;
        margin-right: 10px;
    }
}
@media only screen and (min-width: 1000px) and (max-width: 1400px) { /* 1000-1400 */
    #logo_base_inner {
        width: 1000px;
        height: 130px;
        margin-left: auto;
        margin-right: auto;
    }
}
@media only screen and (min-width: 1400px) { /* 1400over */
    #logo_base_inner {
        width: 1200px;
        height: 150px;
        margin-left: auto;
        margin-right: auto;
    }
}


/* logo */
#logo {
    width: 170px;
    padding-top: 20px;
    margin-left: 0;
    margin-right: auto;
    text-align: left;
}
#logo img {
    width: 100%;
    height: auto;
}
@media only screen and (min-width: 700px) and (max-width: 789px) { /* 700-789 */
    #logo {
        width: 190px;
        margin-left: auto;
        text-align: center;
    }
}
@media only screen and (min-width: 790px) and (max-width: 999px) { /* 790-999 */
    #logo {
        width: 210px;
        margin-left: auto;
        text-align: center;
    }
}
@media only screen and (min-width: 1000px) and (max-width: 1400px) { /* 1000-1400 */
    #logo {
        width: 230px;
        margin-left: auto;
        text-align: center;
    }
}
@media only screen and (min-width: 1400px) { /* 1400over */
    #logo {
        width: 250px;
        margin-left: auto;
        text-align: center;
    }
}


/* drawer-btn */
.drawer-btn {
    position:absolute;
    z-index: 99;
}
.btn_top {
    right: 0px;
    top: 335px;
}
.btn_sub {
    right: 0px;
    top: 206px;
}
.drawer-btn img {
    width: 38px;
    height: auto;
}
.drawer-btn a {
    font-size: 2.7rem;
    display: block;
    width: 70px;
    box-sizing: border-box;
    padding-top: 10px;
    padding-bottom: 10px;
    text-align: center;
    color: #fff;
    text-decoration: none;
    background-color: #062c35;
    border-top-left-radius: 5px;
    border-bottom-left-radius: 5px;
}
.drawer-btn small {
    display: block;
    font-size: 1.3rem;
}
.fixed {
    position: fixed!important;
    right: 0px;
    top: 20px!important;
}
@media only screen and (min-width: 700px) and (max-width: 789px) { /* 700-789 */
    .btn_top {
        top: 370px;
    }
    .btn_sub {
        top: 230px;
    }
    .drawer-btn img {
        width: 45px;
    }
    .drawer-btn a {
        font-size: 2.9rem;
        width: 86px;
    }
    .drawer-btn small {
        font-size: 1.4rem;
    }
}
@media only screen and (min-width: 790px) and (max-width: 999px) { /* 790-999 */
    .btn_top {
        top: 400px;
    }
    .btn_sub {
        top: 270px;
    }
    .drawer-btn img {
        width: 50px;
    }
    .drawer-btn a {
        font-size: 3.1rem;
        width: 90px;
    }
    .drawer-btn small {
        font-size: 1.5rem;
    }
}
@media only screen and (min-width: 1000px) and (max-width: 1400px) { /* 1000-1400 */
    .btn_top {
        top: 520px;
    }
    .btn_sub {
        top: 290px;
    }
    .drawer-btn img {
        width: 55px;
    }
    .drawer-btn a {
        font-size: 3.2rem;
        width: 96px;
    }
    .drawer-btn small {
        font-size: 1.5rem;
    }
}
@media only screen and (min-width: 1400px) { /* 1400over */
    .btn_top {
        top: 570px;
    }
    .btn_sub {
        top: 320px;
    }
    .drawer-btn img {
        width: 60px;
    }
    .drawer-btn a {
        font-size: 3.5rem;
        width: 100px;
    }
    .drawer-btn small {
        font-size: 1.6rem;
    }
}


/* header */
#header {
    width: 100%;
    background-color: #062c35;
}
#header_inner {
    width: calc(100% - 20px);
    overflow: hidden;
    margin-left: 10px;
    margin-right: 10px;
    padding-top: 10px;
    padding-bottom: 10px;
}
@media only screen and (min-width: 700px) and (max-width: 789px) { /* 700-789 */
    #header_inner {
        width: calc(100% - 20px);
        margin-left: 10px;
        margin-right: 10px;
    }
}
@media only screen and (min-width: 790px) and (max-width: 999px) { /* 790-999 */
    #header_inner {
        width: calc(100% - 20px);
        margin-left: 10px;
        margin-right: 10px;
    }
}
@media only screen and (min-width: 1000px) and (max-width: 1400px) { /* 1000-1400 */
    #header_inner {
        width: 1000px;
        margin-left: auto;
        margin-right: auto;
    }
}
@media only screen and (min-width: 1400px) { /* 1400over */
    #header_inner {
        width: 1200px;
        margin-left: auto;
        margin-right: auto;
    }
}


/* disp */
#disp {
    float: none;
    width: 100%;
    padding-top: 15px;
    padding-bottom: 15px;
    overflow: hidden;
    color: #fff;
    text-align: center;
}
#disp h1{
    font-size: 1.4rem;
    font-weight: normal;
}
#disp h2 {
    font-size: 1.4rem;
    font-weight: normal;
    padding-top: 10px;
}
@media only screen and (min-width: 700px) and (max-width: 789px) { /* 700-789 */
    #disp {
        float: none;
        width: 100%;
        text-align: center;
    }
}
@media only screen and (min-width: 790px) and (max-width: 999px) { /* 790-999 */
    #disp {
        float: none;
        width: 100%;
        text-align: center;
    }
}
@media only screen and (min-width: 1000px) and (max-width: 1400px) { /* 1000-1400 */
    #disp {
        float: left;
        width: 400px;
        text-align: left;
    }
}
@media only screen and (min-width: 1400px) { /* 1400over */
    #disp {
        float: left;
        width: 400px;
        text-align: left;
    }
}


/* phones */
#phones {
    float: none;
    width: calc(80px + 190px + 20px);
    padding-top: 10px;
    overflow: hidden;
    margin-left: auto;
    margin-right: auto;
}
.phones_time {
    float: left;
    overflow: hidden;
    margin-bottom: 10px;
}
.phones_number {
    float: left;
    overflow: hidden;
    margin-bottom: 10px;
}
#phones span {
    font-size: 1.7rem;
    color: #006668;
    background-color: #fff;
    display: block;
    float: left;
    width: 80px;
    height: 36px;
    text-align: center;
    padding-top: 4px;
    box-sizing: border-box;
}
#phones em {
    font-family: 'Convergence', sans-serif;
    font-size: 2.0rem;
    font-style: normal;
    text-align: center;
    width: 190px;
    height: 36px;
    display: block;
    float: left;
    color: #fff;
    box-sizing: border-box;
    padding-top: 4px;
    margin-left: 10px;
    margin-right: 10px;
    border-top: solid 1px #fff;
    border-bottom: solid 1px #fff;
}
@media only screen and (min-width: 700px) and (max-width: 789px) { /* 700-789 */
    #phones {
        float: none;
        width: calc(290px * 2);
        padding-top: 10px;
    }
    #phones span {
        font-size: 1.9rem;
        width: 80px;
        height: 42px;
        padding-top: 6px;
    }
    #phones em {
        font-size: 2.2rem;
        width: 190px;
        height: 42px;
        padding-top: 6px;
    }
}
@media only screen and (min-width: 790px) and (max-width: 999px) { /* 790-999 */
    #phones {
        float: none;
        width: calc(290px * 2);
        padding-top: 10px;
    }
    #phones span {
        font-size: 2.0rem;
        width: 80px;
        height: 44px;
        padding-top: 5px;
    }
    #phones em {
        font-size: 2.3rem;
        width: 190px;
        height: 44px;
        padding-top: 6px;
    }
}
@media only screen and (min-width: 1000px) and (max-width: 1400px) { /* 1000-1400 */
    #phones {
        float: right;
        width: calc(290px * 2);
        padding-top: 15px;
    }
    #phones span {
        font-size: 2.1rem;
        width: 80px;
        height: 46px;
        padding-top: 5px;
    }
    #phones em {
        font-size: 2.4rem;
        width: 190px;
        height: 46px;
        padding-top: 6px;
    }
}
@media only screen and (min-width: 1400px) { /* 1400over */
    #phones {
        float: right;
        width: calc(290px * 2);
        padding-top: 20px;
    }
    #phones span {
        font-size: 2.2rem;
        width: 80px;
        height: 50px;
        padding-top: 8px;
    }
    #phones em {
        font-size: 2.5rem;
        width: 190px;
        height: 50px;
        padding-top: 8px;
    }
}


/* mono */
#mono {
    width: calc(100% - 20px);
    margin-left: 10px;
    margin-right: 10px;
    padding-top: 20px;
    padding-bottom: 20px;
    overflow: hidden;
}
@media only screen and (min-width: 700px) and (max-width: 789px) { /* 700-789 */
    #mono {
        width: calc(100% - 20px);
        margin-left: 10px;
        margin-right: 10px;
    }
}
@media only screen and (min-width: 790px) and (max-width: 999px) { /* 790-999 */
    #mono {
        width: calc(100% - 20px);
        margin-left: 10px;
        margin-right: 10px;
    }
}
@media only screen and (min-width: 1000px) and (max-width: 1400px) { /* 1000-1400 */
    #mono {
        width: 100%;
        margin-left: auto;
        margin-right: auto;
    }
}
@media only screen and (min-width: 1400px) { /* 1400over */
    #mono {
        width: 100%;
        margin-left: auto;
        margin-right: auto;
    }
}


/* top_entry */
.top_entry {
    width: 100%;
    text-align: center;
    padding-top: 30px;
    padding-bottom: 40px;
    background-color: #fff;
}
.top_entry h1 {
    font-family: 'ヒラギノ明朝 Pro W3', 'Hiragino Mincho Pro', '游明朝','Yu Mincho', '游明朝体', 'YuMincho','ＭＳ Ｐ明朝', 'MS PMincho', serif, sans-serif;
    font-size: 2rem;
    padding-left: 20px;
    padding-right: 20px;
}
.top_entry h1 br {
    display: block;
}
.top_entry p {
    font-size: 1.6rem;
    padding-top: 10px;
    padding-left: 20px;
    padding-right: 20px;
}
@media only screen and (min-width: 700px) and (max-width: 789px) { /* 700-789 */
    .top_entry h1 {
        font-size: 2.0rem;
    }
    .top_entry h1 br {
        display: none;
    }
    .top_entry p {
        font-size: 1.7rem;
    }
}
@media only screen and (min-width: 790px) and (max-width: 999px) { /* 790-999 */
    .top_entry h1 {
        font-size: 2.3rem;
    }
    .top_entry h1 br {
        display: none;
    }
    .top_entry p {
        font-size: 1.8rem;
    }
}
@media only screen and (min-width: 1000px) and (max-width: 1400px) { /* 1000-1400 */
    .top_entry h1 {
        font-size: 2.7rem;
    }
    .top_entry h1 br {
        display: none;
    }
    .top_entry p {
        font-size: 1.9rem;
    }
}
@media only screen and (min-width: 1400px) { /* 1400over */
    .top_entry h1 {
        font-size: 3rem;
    }
    .top_entry h1 br {
        display: none;
    }
    .top_entry p {
        font-size: 2.0rem;
    }
}


/* profile_area */
#profile_area {
    float: none;
    width: 100%;
    height: 300px;
    background-color: #f1f1f1;
    position: relative;
    margin-right: 0px;
    margin-bottom: 20px;
    background-image: url(image/base/side_bg.jpg);
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
}
.profile {
    position: absolute;
    width: 50%;
    right: 10px;
    bottom: 10px;
    z-index: 9;
    padding-left: 10px;
    padding-right: 10px;
    padding-top: 10px;
    padding-bottom: 10px;
    background-color: #fff;

}
.profile h2 {
    font-size: 1.8rem;
}
.profile span {
    font-size: 1.5rem;
}
.profile span a {
    display: block;
    text-decoration: none;
    color: #fff;
    background-color: #006668;
    padding-top: 3px;
    padding-left: 10px;
    padding-right: 10px;
    padding-bottom: 3px;
    border-radius: 5px;
    text-align: center;
    margin-left: auto;
    margin-right: auto;
}
.profile span a:hover {
    background-color: #f60;
}
@media only screen and (min-width: 700px) and (max-width: 789px) { /* 700-789 */
    #profile_area {
        float: none;
        width: 100%;
        height: 310px;
        margin-right: 0px;
    }
    .profile {
        width: 50%;
        right: 10px;
        bottom: 10px;
    }
    .profile h2 {
        font-size: 1.9rem;
    }
    .profile span {
        font-size: 1.6rem;
    }
}
@media only screen and (min-width: 790px) and (max-width: 999px) { /* 790-999 */
    #profile_area {
        float: right;
        width: calc(100% - 60% - 10px - 10px);
        height: 500px;
        margin-right: 10px;
    }
    .profile {
        width: 50%;
        right: 10px;
        bottom: 10px;
    }
    .profile h2 {
        font-size: 1.9rem;
    }
    .profile span {
        font-size: 1.6rem;
    }
}
@media only screen and (min-width: 1000px) and (max-width: 1400px) { /* 1000-1400 */
    #profile_area {
        float: right;
        width: calc(100% - 65% - 10px - 10px);
        height: 700px;
        margin-right: 10px;
    }
    .profile {
        width: 220px;
        right: 10px;
        bottom: 10px;
    }
    .profile h2 {
        font-size: 2.0rem;
    }
    .profile span {
        font-size: 1.7rem;
    }
}
@media only screen and (min-width: 1400px) { /* 1400over */
    #profile_area {
        float: right;
        width: calc(100% - 70% - 10px - 10px);
        height: 800px;
        margin-right: 10px;
    }
    .profile {
        width: 230px;
        right: 10px;
        bottom: 10px;
    }
    .profile h2 {
        font-size: 2.0rem;
    }
    .profile span {
        font-size: 1.7rem;
    }
}


/* top_news_area */
#top_news_area {
    overflow: hidden;
    width: 100%;
    float: none;
    margin-left: 0px;
}
.top_news {
    float: left;
    width: calc(100% - 20px);
    overflow: hidden;
    margin-left: 10px;
    margin-right: 10px;
    margin-bottom: 10px;
    background-color: #376d7d;
}
.blog_title {
    float: left;
    width: calc(50% - 40px);
    margin-left: 20px;
    margin-bottom: 20px;
    padding-top: 20px;
}
.top_news_image {
    float: right;
    width: 50%;
    margin-left: auto;
    margin-right: auto;
}
.top_news_image img {
    width: 100%;
    height: auto;
    object-fit: cover;
    object-position: center center;
    vertical-align: bottom;
}
.top_news_image a {
    display: block;
}
.category_header_icon {
    font-family: 'Convergence', sans-serif;
    font-size: 1.6rem;
    color: #fff;
    filter: drop-shadow(0px 0px 2px rgba(0,0,0,0.6));
}
.top_news time {
    font-size: 1.4rem;
    color: #fff;
}
.top_news h2 {
    font-size: 1.6rem;
}
.top_news h2 a {
    font-weight: normal;
    text-decoration: none;
    color: #fff;
}
.top_news h2 a:hover {
    color: #f60;
    border-bottom: solid 1px #fff;
}
@media only screen and (min-width: 700px) and (max-width: 789px) { /* 700-789 */
    .top_news {
        width: calc(100% - 20px);
    }
    .category_header_icon {
        font-size: 1.9rem;
    }
    .top_news time {
        font-size: 1.4rem;
    }
    .top_news h2 {
        font-size: 1.7rem;
    }
}
@media only screen and (min-width: 790px) and (max-width: 999px) { /* 790-999 */
    .top_news {
        width: calc(100% / 2 - 20px);
    }
    .category_header_icon {
        font-size: 2.0rem;
    }
    .top_news time {
        font-size: 1.5rem;
    }
    .top_news h2 {
        font-size: 1.8rem;
    }
}
@media only screen and (min-width: 1000px) and (max-width: 1400px) { /* 1000-1400 */
    .top_news {
        width: calc(100% / 2 - 20px);
    }
    .category_header_icon {
        font-size: 2.6rem;
    }
    .top_news time {
        font-size: 1.6rem;
    }
    .top_news h2 {
        font-size: 1.9rem;
    }
}
@media only screen and (min-width: 1400px) { /* 1400over */
    .top_news {
        width: calc(100% / 2 - 20px);
    }
    .category_header_icon {
        font-size: 3.0rem;
    }
    .top_news time {
        font-size: 1.7rem;
    }
    .top_news h2 {
        font-size: 2rem;
    }
}


/* top_news_area_sub */
#top_news_area_sub {
    clear: both;
    overflow: hidden;
}
.top_news_sub {
    float: left;
    width: calc(100% / 2 - 20px);
    margin-left: 10px;
    margin-right: 10px;
    margin-bottom: 10px;
    background-color: #5e4d4d;
}
.top_news_image_sub {
    width: calc(100% - 20px);
    margin-left: 10px;
    margin-right: 10px;
    margin-top: 10px;
    margin-bottom: 10px;
}
.top_news_image_sub img {
    width: 100%;
    height: auto;
    object-fit: cover;
    object-position: center center;
}
.blog_title_sub {
    padding-left: 10px;
    padding-right: 10px;
    padding-bottom: 10px;
}
.category_header_icon_sub {
    font-family: 'Convergence', sans-serif;
    font-size: 1.8rem;
    color: #fff;
    filter: drop-shadow(0px 0px 2px rgba(0,0,0,0.6));
}
.top_news_sub time {
    font-size: 1.4rem;
    color: #fff;
}
.top_news_sub h2 {
    display: block;
    font-size: 1.6rem;
}
.top_news_sub h2 a {
    font-weight: normal;
    text-decoration: none;
    color: #fff;
}
.top_news_sub h2 a:hover {
    color: #f60;
    border-bottom: solid 1px #fff;
}
@media only screen and (min-width: 700px) and (max-width: 789px) { /* 700-789 */
    .top_news_sub {
        width: calc(100% / 2 - 20px);
    }
    .category_header_icon_sub {
        font-size: 2.0rem;
    }
    .top_news_sub time {
        font-size: 1.4rem;
    }
    .top_news_sub h2 {
        font-size: 1.7rem;
    }
}
@media only screen and (min-width: 790px) and (max-width: 999px) { /* 790-999 */
    .top_news_sub {
        width: calc(100% / 3 - 20px);
    }
    .category_header_icon_sub {
        font-size: 2.2rem;
    }
    .top_news_sub time {
        font-size: 1.5rem;
    }
    .top_news_sub h2 {
        font-size: 1.8rem;
    }
}
@media only screen and (min-width: 1000px) and (max-width: 1400px) { /* 1000-1400 */
    .top_news_sub {
        width: calc(100% / 4 - 20px);
    }
    .category_header_icon_sub {
        font-size: 2.4rem;
    }
    .top_news_sub time {
        font-size: 1.6rem;
    }
    .top_news_sub h2 {
        font-size: 1.9rem;
    }
}
@media only screen and (min-width: 1400px) { /* 1400over */
    .top_news_sub {
        width: calc(100% / 4 - 20px);
    }
    .category_header_icon_sub {
        font-size: 2.6rem;
    }
    .top_news_sub time {
        font-size: 1.7rem;
    }
    .top_news_sub h2 {
        font-size: 2.0rem;
    }
}


/* button_detail */
.button_detail {
    padding-top: 10px;
    padding-bottom: 10px;
    clear: both;
}
.button_detail a {
    font-size: 2rem;
    text-decoration: none;
    text-align: center;
    padding-top: 20px;
    padding-bottom: 20px;
    margin-top: 10px;
    display: block;
    color: #fff;
    background-color: #062c35;
    margin-left: auto;
    margin-right: auto;
    width: 240px;
}
.button_detail a:hover {
    color: #F60;
}


/* drawer */
.drawer a {
    font-size: 1.9rem;
    text-decoration: none;
    display: block;
    color: #fff;
    padding-top: 10px;
    padding-bottom: 10px;
    text-align: center;
    border-bottom: solid 1px #83a09d;
    margin-left: 10px;
    margin-right: 10px;
    filter: drop-shadow(0px 0px 2px rgba(0,0,0,0.3));
}
.drawer a:hover {
  color: #f60;
}
.drawer small {
    display: block;
    font-size: 60%;
}
@media only screen and (min-width: 700px) and (max-width: 789px) { /* 700-789 */
    .drawer a {
        font-size: 2.0rem;
    }
}
@media only screen and (min-width: 790px) and (max-width: 999px) { /* 790-999 */
    .drawer a {
        font-size: 2.1rem;
    }
}
@media only screen and (min-width: 1000px) and (max-width: 1400px) { /* 1000-1400 */
    .drawer a {
        font-size: 2.2rem;
    }
}
@media only screen and (min-width: 1400px) { /* 1400over */
    .drawer a {
        font-size: 2.3rem;
    }
}


/* under_theme */
#under_theme {
    width: 100%;
    height: 160px;
    background-size: cover;
    background-position: center center;
    margin-top: -1px;
}
.under_theme_all {
    background-image: url(image/sl/sl_02.jpg);
}
@media only screen and (min-width: 700px) and (max-width: 789px) { /* 700-789 */
    #under_theme {
        height: 170px;
    }
}
@media only screen and (min-width: 790px) and (max-width: 999px) { /* 790-999 */
    #under_theme {
        height: 180px;
    }
}
@media only screen and (min-width: 1000px) and (max-width: 1400px) { /* 1000-1400 */
    #under_theme {
        height: 190px;
    }
}
@media only screen and (min-width: 1400px) { /* 1400over */
    #under_theme {
        height: 200px;
    }
}


/* company_area */
#company_area {
    padding-top: 20px;
    margin-left: 10px;
    margin-right: 10px;
    text-align: center;
}
.company_logo {
    width: 230px;
    margin-left: auto;
    margin-right: auto;
}
.company_logo img {
    width: 100%;
    height: auto;
}
.company_address,
.company_phones,
.company_service_time {
    font-size: 1.8rem;
    padding-top: 5px;
}


/* under_nav */
#under_nav {
    width: 100%;
    padding-top: 20px;
    padding-bottom: 20px;
}
#under_nav_inner {
    width: 100%;
    margin-left: 10px;
    margin-right: 10px;
}
#under_nav ul {
    overflow: hidden;
}
#under_nav ul li {
    float: left;
    width: calc(100% / 2 - 20px);
    height: auto;
    margin-bottom: 10px;
    margin-left: 10px;
    margin-right: 10px;
}
#under_nav a {
    font-size: 1.6rem;
    display: block;
    text-align: center;
    width: 100%;
    text-decoration: none;
    color: #fff;
    background-color: #062c35;
    padding-top: 10px;
    padding-bottom: 10px;
}
#under_nav small {
    display: block;
    font-size: 70%;
    font-weight: normal;
}
#under_nav a:hover {
    color: #f60;
}
@media only screen and (min-width: 700px) and (max-width: 789px) { /* 700-789 */
    #under_nav_inner {
        width: 100%;
        margin-left: 10px;
        margin-right: 10px;
    }
    #under_nav ul li {
        width: calc(100% / 2 - 20px);
    }
    #under_nav a {
        font-size: 1.7rem;
    }
}
@media only screen and (min-width: 790px) and (max-width: 999px) { /* 790-999 */
    #under_nav_inner {
        width: 100%;
        margin-left: 10px;
        margin-right: 10px;
    }
    #under_nav ul li {
        width: calc(100% / 3 - 20px);
    }
    #under_nav a {
        font-size: 1.8rem;
    }
}
@media only screen and (min-width: 1000px) and (max-width: 1400px) { /* 1000-1400 */
    #under_nav_inner {
        width: 1000px;
        margin-left: auto;
        margin-right: auto;
    }
    #under_nav ul li {
        width: calc(100% / 4 - 20px);
    }
    #under_nav a {
        font-size: 1.9rem;
    }
}
@media only screen and (min-width: 1400px) { /* 1400over */
    #under_nav_inner {
        width: 1200px;
        margin-left: auto;
        margin-right: auto;
    }
    #under_nav ul li {
        width: calc(100% / 4 - 20px);
    }
    #under_nav a {
        font-size: 2.0rem;
    }
}


#under_sub_nav {
    font-size: 1.7rem;
    text-align: center;
    width: 100%;
}
#under_sub_nav li a {
    text-decoration: none;
    color: #333;
}


/* copy_design */
#copy_design {
    width: 100%;
    height: auto;
    clear: both;
    text-align: center;
    font-size: 1.5rem;
    padding-top: 30px;
    padding-bottom: 45px;
}
#design {
    padding-top: 10px;
}


/* widget */
.widget {
    padding: 10px;
    margin-top: 15px;
    margin-left: 10px;
    margin-right: 10px;
    margin-bottom: 20px;
    border: solid 1px #a7a7a7;
    border-radius: 5px;
}
.widget a {
    text-decoration: none;
    color: #333;
    margin-left: 5px;
    margin-right: 5px;
}
.widget a:hover {
    color: #f60;
}


/* course_area */
#course_area {
    width: 100%;
    padding-top: 50px;
    padding-bottom: 50px;
    background-image: url(image/base/middle_bg1.jpg);
    background-position: center center;
    background-size: cover;
}
#course_area_inner {
    width: 100%;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 10px;
    overflow: hidden;
}
.course {
    float: left;
    width: calc(100% / 1 - 20px);
    padding-top: 10px;
    padding-bottom: 10px;
    margin-left: 10px;
    margin-right: 10px;
    margin-bottom: 10px;
    text-align: center;
}
.course_a {
    background-color: rgb(197 76 28 / 80%);
}
.course_b {
    background-color: rgb(36 47 163 / 80%);
}
.course h1,
.list_course h1 {
    font-family: 'ヒラギノ明朝 Pro W3', 'Hiragino Mincho Pro', '游明朝','Yu Mincho', '游明朝体', 'YuMincho','ＭＳ Ｐ明朝', 'MS PMincho', serif, sans-serif;
    font-size: 2.4rem;
    color: #fff;
    margin-left: 15px;
    margin-right: 15px;
    border-bottom: solid 1px #fff;
    padding-bottom: 4px;
}
.course h2,
.list_course h2 {
    font-family: 'ヒラギノ明朝 Pro W3', 'Hiragino Mincho Pro', '游明朝','Yu Mincho', '游明朝体', 'YuMincho','ＭＳ Ｐ明朝', 'MS PMincho', serif, sans-serif;
    font-size: 2.0rem;
    color: #fff;
    padding-top: 5px;
}
.list_course h2 {
    color: #000000;
    padding-top: 16px;
}
.course p {
    font-size: 1.5rem;
    color: #fff;
    padding-top: 10px;
    padding-left: 20px;
    padding-right: 20px;
    text-align: left;
    height: auto;
}
.list_course {
width: calc(100% - 20px);
background-color: rgb(231 231 231 / 80%);
padding-top: 24px;
padding-bottom: 24px;
margin-left: 10px;
margin-right: 10px;
margin-bottom: 25px;
text-align: center;
}
.list_course h1 {
    color: #333!important;
    border-color: #000000;
}
.list_course ol {
    padding-top: 10px;
    padding-bottom: 5px;
}
.list_course ol li {
    font-size: 1.7rem;
    color: #333;
}
.course ul {
    overflow: hidden;
    padding-top: 10px;
    margin-left: 20px;
    margin-right: 20px;
}
.course ul li {
    font-size: 1.8rem;
    position: relative;
    text-align: left;
    margin-bottom: 20px;
}
.course li a {
    text-decoration: none;
    color: #333;
    display: block;
    background-color: #fff;
    padding-top: 15px;
    padding-bottom: 15px;
    padding-left: 10px;
    overflow: hidden;
}
.course li a:hover {
    color: #f60;
    background-color: #fff1d7;
}
.course em {
    font-family: 'ヒラギノ明朝 Pro W3', 'Hiragino Mincho Pro', '游明朝','Yu Mincho', '游明朝体', 'YuMincho','ＭＳ Ｐ明朝', 'MS PMincho', serif, sans-serif;
    font-weight: bold;
    font-style: normal;
}
.course small {
    font-size: 75%;
    color: #be0303;
    display: block;
}
.course_box_left {
    float: left;
    width: calc(100% - 35px);
    height: auto;
    display: block;
}
.course_box_right {
    float: right;
    width: 30px;
    height: auto;
    display: block;
    text-align: center;
    font-weight: bold;
}
@media only screen and (min-width: 700px) and (max-width: 789px) { /* 700-789 */
    #course_area_inner {
        width: 100%;
    }
    .course {
        width: calc(100% / 2 - 20px);
    }
    .course h1,
    .list_course h1 {
        font-size: 2.8rem;
    }
    .course h2,
    .list_course h2 {
        font-size: 2.2rem;
    }
    .course p {
        font-size: 1.5rem;
        height: 155px;
    }
    .course ul li,
    .list_course ol li {
        font-size: 1.7rem;
    }
}
@media only screen and (min-width: 790px) and (max-width: 999px) { /* 790-999 */
    #course_area_inner {
        width: 100%;
    }
    .course {
        width: calc(100% / 2 - 20px);
    }
    .course h1,
    .list_course h1 {
        font-size: 3.0rem;
    }
    .course h2,
    .list_course h2 {
        font-size: 2.4rem;
    }
    .course p {
        font-size: 1.6rem;
        height: 155px;
    }
    .course ul li,
    .list_course ol li {
        font-size: 2.0rem;
    }
}
@media only screen and (min-width: 1000px) and (max-width: 1400px) { /* 1000-1400 */
    #course_area_inner {
        width: 1000px;
    }
    .course {
        width: calc(100% / 2 - 20px);
    }
    .course h1,
    .list_course h1 {
        font-size: 3.2rem;
    }
    .course h2,
    .list_course h2 {
        font-size: 2.6rem;
    }
    .course p {
        font-size: 1.7rem;
        height: 145px;
    }
    .course ul li,
    .list_course ol li {
        font-size: 2.2rem;
    }
}
@media only screen and (min-width: 1400px) { /* 1400over */
    #course_area_inner {
        width: 1200px;
    }
    .course {
        width: calc(100% / 2 - 20px);
    }
    .course h1,
    .list_course h1 {
        font-size: 3.4rem;
    }
    .course h2,
    .list_course h2 {
        font-size: 2.8rem;
    }
    .course p {
        font-size: 1.8rem;
        height: 130px;
    }
    .course ul li,
    .list_course ol li {
        font-size: 2.4rem;
    }
}


/* seminar_profile */
#seminar_profile {
    clear: both;
    width: 100%;
    background-color: rgb(255 255 255 / 69%);
    padding-top: 20px;
    padding-bottom: 20px;
}
#seminar_profile_inner {
    width: 100%;
    overflow: hidden;
    margin-left: auto;
    margin-right: auto;
}
#seminar {
    float: left;
    width: calc(100% -  20px);
    background-color: rgb(33 113 53 / 85%);
    text-align: center;
    margin-left: 10px;
    margin-right: 10px;
    margin-bottom: 10px;
    padding-bottom: 10px;
}
#seminar h1 {
    font-family: 'ヒラギノ明朝 Pro W3', 'Hiragino Mincho Pro', '游明朝','Yu Mincho', '游明朝体', 'YuMincho','ＭＳ Ｐ明朝', 'MS PMincho', serif, sans-serif;
    font-size: 2.3rem;
    color: #fff;
    padding-top: 10px;
}
#seminar h2 {
    font-size: 1.7rem;
}
#seminar h2 a {
    color: #fff;
    text-decoration: none;
    display: block;
    padding-top: 10px;
    padding-left: 15px;
    padding-right: 15px;
    padding-bottom: 10px;
    border-bottom: solid 1px #fff;
    margin-left: 15px;
    margin-right: 15px;
}
#seminar h2 a:hover {
    color: #f60;
}
#profile {
    float: right;
    width: calc(100% -  20px);
    margin-left: 10px;
    margin-right: 10px;
}
.profile_left {
    float: left;
    width: calc(100% - 160px);
}
.profile_right {
    float: right;
    width: 150px;
    text-align: center;
}
#profile h1 {
    font-family: 'ヒラギノ明朝 Pro W3', 'Hiragino Mincho Pro', '游明朝','Yu Mincho', '游明朝体', 'YuMincho','ＭＳ Ｐ明朝', 'MS PMincho', serif, sans-serif;
    font-size: 2.1rem;
    padding-left: 10px;
}
#profile p {
    font-size: 1.5rem;
    padding-top: 5px;
    padding-left: 10px;
}
.button_profile {
    padding-top: 20px;
}
.button_profile a {
    font-family: 'ヒラギノ明朝 Pro W3', 'Hiragino Mincho Pro', '游明朝','Yu Mincho', '游明朝体', 'YuMincho','ＭＳ Ｐ明朝', 'MS PMincho', serif, sans-serif;
    font-size: 1.7rem;
    text-decoration: none;
    display: block;
    width: 160px;
    text-align: center;
    background-color: #333;
    color: #fff;
    padding-top: 8px;
    padding-bottom: 8px;
    margin-left: auto;
    margin-right: auto;
}
.button_profile a:hover {
    color: #f60;
}
.profile_image {
    width: 150px;
    height: 150px;
    border-radius: 50%;
    background-image: url(image/base/profile_22.jpg);
    background-size: cover;
    background-position: center center;
    margin-left: auto;
    margin-right: auto;
}
@media only screen and (min-width: 700px) and (max-width: 789px) { /* 700-789 */
    #seminar_profile_inner {
        width: 100%;
    }
    #seminar {
        width: calc(50% -  20px);
    }
    #profile {
        width: calc(50% -  20px);
    }
    #seminar h1 {
        font-size: 2.5rem;
    }
    #profile h1 {
        font-size: 2.5rem;
    }
    #seminar h2 {
        font-size: 1.9rem;
    }
    #profile p {
        font-size: 1.6rem;
    }
}
@media only screen and (min-width: 790px) and (max-width: 999px) { /* 790-999 */
    #seminar_profile_inner {
        width: 100%;
    }
    #seminar {
        width: calc(50% -  20px);
    }
    #profile {
        width: calc(50% -  20px);
    }
    #seminar h1 {
        font-size: 2.7rem;
    }
    #profile h1 {
        font-size: 2.7rem;
    }
    #seminar h2 {
        font-size: 2.0rem;
    }
    #profile p {
        font-size: 1.6rem;
    }
}
@media only screen and (min-width: 1000px) and (max-width: 1400px) { /* 1000-1400 */
    #seminar_profile_inner {
        width: 1000px;
    }
    #seminar {
        width: calc(50% -  20px);
    }
    #profile {
        width: calc(50% -  20px);
    }
    #seminar h1 {
        font-size: 2.9rem;
    }
    #profile h1 {
        font-size: 2.9rem;
    }
    #seminar h2 {
        font-size: 2.2rem;
    }
    #profile p {
        font-size: 1.7rem;
    }
}
@media only screen and (min-width: 1400px) { /* 1400over */
    #seminar_profile_inner {
        width: 1200px;
    }
    #seminar {
        width: calc(50% -  20px);
    }
    #profile {
        width: calc(50% -  20px);
    }
    #seminar h1 {
        font-size: 3.1rem;
    }
    #profile h1 {
        font-size: 3.1rem;
    }
    #seminar h2 {
        font-size: 2.4rem;
    }
    #profile p {
        font-size: 1.8rem;
    }
}


/* single_button_contact */
.single_button_contact {
    clear: both;
    text-align: center;
    padding-top: 5px;
    padding-bottom: 10px;
}
.single_button_contact a {
    font-size: 2.2rem;
    font-weight: bold;
    text-decoration: none;
    display: block;
    width: 300px;
    margin-left: auto;
    margin-right: auto;
    color: #fff;
    background-color: #006668;
    border-radius: 5px;
    padding-top: 10px;
    padding-bottom: 10px;
}
.single_button_contact a:hover {
    background-color: #f60;
}
.single_button_contact small {
    font-size: 1.7rem;
    padding-bottom: 10px;
    display: block;
}

/* sns */
.sns {
    width: 100%;
}
.sns a {
    display: block;
    font-size: 2.7rem;
    line-height: 70%;
    padding-top: 13px;
    text-align: center;
    text-decoration: none;
    width: 80px;
    margin-left: auto;
    margin-right: auto;
}
.sns a small {
    display: block;
    font-size: 40%;
}
.sns_x {
    color: #000000;
}
@media only screen and (min-width: 700px) and (max-width: 789px) { /* 700-789 */
    .sns a {
        font-size: 2.9rem;
    }
}
@media only screen and (min-width: 790px) and (max-width: 999px) { /* 790-999 */
    .sns a {
        font-size: 3.1rem;
    }
}
@media only screen and (min-width: 1000px) and (max-width: 1400px) { /* 1000-1400 */
    .sns a {
        font-size: 3.3rem;
    }
}
@media only screen and (min-width: 1400px) { /* 1400over */
    .sns a {
        font-size: 3.6rem;
    }
}


.sl_image {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center center;
}