@charset "utf-8";

/* CSS Document */
body {
    font-size: 14px;
}

.sp {
    display: block !important;
}

.pc {
    display: none !important;
}
#spnav {
    position: absolute;
    right: 0.5em;
    top: 1.75em;
    font-size: 2em;
}
#spnav a {text-decoration: none;width: 1em;display: block;}
#spnav a i {display: block;margin: 0 auto;}
#spnav a span {
    display: block;
    text-align: center;
    line-height: 1.25em;
    font-size: 9px;
    margin-left: -2px;
}
ul#nav {display: none;}
header section {
    width: 100%;
    height: auto;
    padding-left: 0;
    padding-right: 0;
}
header section nav li {
    width: 100%;
    background: linear-gradient(0deg, #796657, #635041);
    border-bottom: 2px solid #e8c976;
    
}
header section nav li a {text-decoration: none;padding: 1em 0;display: block;}
header section nav li a:hover p {color: #FF9900;}
header section nav li a p {text-align: center;color: #fff;margin: 0;}
header section nav li img {
    width: min(184px,100%);
    margin: auto;
    display: block;
}
header section nav {
    position: absolute;
    left: 0;
    right: 0;
    z-index: 1;
}
header.low,
header {
    background-image: none;
    position: relative;
    height: auto;
}
header.low section nav {
    line-height: 1.4em;
    font-size: 1em;
}
header.low section {
    height: auto;
}

header section img#logo {
    float: none;
    width: min(182px, 100%);
    height: auto;
    text-align: center;
    display: block;
}

header section div.right {
    width: 100%;
    height: auto;
    float: none;
    max-width: 100%;
}

header section h1 {
    font-size: 10px;
    margin-bottom: 1em;
}

header section img#tel {
    float: none;
    width: 12.5em;
    height: auto;
    max-width: 237px;
    position: absolute;
    top: 0.75em;
    right: 1em;
}

div#top_img div.ti_txt p.big_red {
    font-size: 1.075em;
}

div#top_img div.ti_txt div.ti_logo span {
    font-size: 0.857em;
}

div#top_img p.system span {
    margin: 0 auto 0 auto;
}

#main a img.heading {
    height: auto;
}

article section#contents section#main {
    width: 100%;
    float: none;
    max-width: 100%;
    box-sizing: border-box;
    border: 1px solid #000;
    background-image: none;
    background-color: #fff;
}

article section#contents aside {
    width: 100%;
    float: none;
    max-width: 100%;
}

article section#contents {
    width: 100%;
    padding-left: 0;
    padding-right: 0;
}

footer {
    padding-bottom: 1em;
}

footer section li {
    width: calc(100% / 7);
}

footer section div {
    width: 60%;
    margin-top: 2em;
}

footer section img#logo-footer {
    margin-top: 2em;
    margin-left: 10%;
}

footer section p.copy {
    text-align: center;
    padding-top: 3em;
}

article section#contents section#menu-top {
    background-image: url(../images/top/bg_parts.jpg);
    background-repeat: repeat;
    height: auto;
    margin-bottom: 0;
    background-size: auto;
    border: 2px solid #f5815f;
    box-sizing: border-box;
    padding-left: 0;
    margin-bottom: 1em;
    padding-bottom: 2em;
}

article section#contents section#menu-top figure {
    font-size: 11px;
    display: inline;
    width: 80%;
    margin-top: 4em;
    margin-right: auto;
    margin-left: auto;
    float: none;
    display: block;
    background-color: #fff;
    padding: 2em 1em 2em 1em;
    border: 2px solid #f5815f;
    width: min(207px, 60%);
    box-sizing: border-box;
}

article section#contents section#menu-top figure img {
    display: block;
    margin: 0 auto 1em auto;
}

section#main section#aisatsu p {
    width: 96%;
    margin: 0 2%;
    padding: 0px;
    float: none;
}

section#main section#aisatsu div.bg,
section#main section#counseling div.bg {
    width: 100%;
    box-sizing: border-box;
}

section#main section#aisatsu h1 img,
section#main section#counseling h1 img {
    vertical-align: bottom;
    width: 100%;
    height: auto;
}

section#main section#aisatsu figure {
    float: none;
    margin: 2em auto;
    display: block;
}

section#main section#counseling div.bg dl dt {
    line-height: auto;
    height: auto;
    padding-left: 1.6em;
    text-indent: -1em;
}

section#main section#counseling div.bg dl dd {
    padding-left: 0;
    padding-right: 0;
    margin: 1em auto;
}

section#main section#jirei {
    float: none;
    padding: 2%;
    width: 100%;
    height: auto;
    box-sizing: border-box;
}

section#main section#jirei h1 {
    padding-top: 10px;
    padding-left: 39%;
    width: 100%;
    height: auto;
    box-sizing: border-box;
    padding-bottom: 10px;
    background-size: 100%;
}

section#main section#jirei li {
    width: 100%;
    padding: 8px 10px 8px 14px;
    box-sizing: border-box;
    text-indent: -0.75em;
}

section#main section#access {
    float: none;
    width: 100%;
    height: auto;
    margin-right: auto;
    box-sizing: border-box;
    margin-top: 1em;
}

section#main section#aisatsu div.bg {
    padding-bottom: 0em;
}

section#main section#access h1 {
    text-align: center;
}

article section#contents aside li.hypno img.ci {
    margin-left: 0;
}

.c-map iframe {
    width: 100%;
}

article section#contents aside section#contact {
    width: 92%;
    height: auto;
    padding: 1em 2em 1em 2em;
    background-size: 100%;
    box-sizing: border-box;
    margin: 1em 4% 3em 4%;
    background-image: none;
    border: 2px dashed #a0c308;
    outline: 3px solid #a0c308;
    outline-offset: 3px;
    text-align: center;
}
article section#contents aside li.hypno br {
    display: none;
}
article section#contents aside li.hypno a {
    width: auto;
}
article section#contents aside section#contact a img {
    padding-left: 0;
    margin: 1em auto;
}

article section#contents aside ul {
    text-align: center;
    margin-top: 0;
}

article section#contents aside ul.sub_menu {
    text-align: left;
}

aside img {
    width: min(220px, 96%);
    height: auto;
}
aside img.dotted {
    width: 100%;
    height: 2px;
}
article section#contents aside li img.ci,
article section#contents aside li.hypno img.ci {
    width: 15px;
}

address {
    width: 96%;
    display: block;
    margin: auto;
}

article section#contents aside p a {
    display: block;
    width: 96%;
    box-sizing: border-box;
    margin: auto;
}

footer section ul {
    display: flow-root;
}

footer section {
    width: 100%;
    margin: 0 auto;
    padding-left: 0;
    padding-right: 0;
}

footer section li {
    text-align: center;
    display: block;
    float: none;
    width: 100%;
}

footer {
    background-color: #C8BDB2;
    background-image: none;
    height: auto;
}

footer section img#logo-footer {
    margin-top: 2em;
    margin-left: auto;
    margin-right: auto;
    display: block;
    float: none;
}

footer section div {
    width: 100%;
    margin-top: 2em;
    border-left: none;
    padding: 0;
    text-align: center;
    line-height: 1.8em;
}

footer section li a {
    font-weight: 600;
    font-size: 13px;
    letter-spacing: 0.05em;
}

#profile,
#infomation,
#case,
#inquiry,
#policy,
#links {
    margin-top: 0px;
    width: 100%;
    padding: 10px;
    box-sizing: border-box;
}

#greeting h1 img.heading {
    height: auto;
}

section#contents_bg {
    margin: auto;
    padding-top: 1.2em;
    margin-top: 0px;
    width: 100%;
    padding: 10px;
    box-sizing: border-box;
}

#profile #pro_file h1 img {
    width: 100%;
    height: auto;
}

#facility img {
    width: 100%;
    height: auto;
}

#profile #pro_file img.photo {
    position: static;
    left: 0;
    display: block;
    margin: auto;
}

#profile #pro_file p.name,
#profile #pro_file p.greeting1 {
    padding-left: 0;
    padding-right: 0;
}

#profile #pro_file p.greeting2 {
    padding-left: 0;
    padding-right: 0;
    padding-top: 1em;
}

#infomation #info dl dd p {
    padding-left: 0;
    padding-right: 0;
    width: 100%;
}

#infomation #info dl dd {
    padding-top: 16em;
    background-position: center top;
}

#infomation #info dl {
    padding-left: 0;
    padding-right: 0;
}

#infomation #skype {
    width: 100%;
    margin-left: 0;
}

#infomation #skype p,
#infomation #skype h2,
#infomation #skype h3 {
    padding-left: 0;
    padding-right: 0;
}

#infomation #skype p.sup {
    padding-left: 0;
}

#infomation #skype dl {
    margin-left: 0;
    margin-right: 0;
}

#infomation #skype h3 {
    margin-left: 0;
    margin-right: 0;
    text-align: center;
}

#infomation #skype ol {
    padding-left: 1.5em;
    padding-right: 0;
}

#infomation #fee {
    width: 100%;
    margin-left: 0;
}

#infomation #fee table {
    width: 100%;
    margin-left: 0;
    margin-top: 0.5em;
}

#infomation #fee table th,
#infomation #fee table td {
    padding-left: 0.5em;
    padding-right: 0.5em;
}

#infomation #fee div.room {
    background-image: none;
}

#infomation #fee p {
    margin-left: 0;
    margin-bottom: 0.5em;
}

#infomation #fee p.ttl {
    margin-bottom: 0.5em;
}

#infomation #fee div.furi dl {
    margin-left: 0;
}

#infomation #map {
    padding-left: 0;
    padding-right: 0;
}

#infomation #map .c_map {
    background-color: #FFFFFF;
    width: 100%;
    height: 320px;
    margin-left: 0;
}

#infomation #map .c_map iframe {
    height: 320px;
}

#case #soudan_case ul li {
    width: 100%;
    background-size: 100%;
}

#case #soudan_case ul li#case15 {
    width: 100%;
    background-size: 137%;
}

#case #soudan_case ul li p {
    background-size: 100%;
    width: 100%;
    box-sizing: border-box;
    padding-top: 15px;
    padding-bottom: 15px;
}

#case #soudan_case ul {
    padding-left: 0;
}

#policy #privacy dl {
    padding-left: 0;
    padding-right: 0;
}

#policy #privacy dl dd {
    padding-left: 0;
}

#policy #privacy dl dd table {
    margin-left: 0;
}

#policy #privacy dl dd table th {
    text-align: right;
    padding-right: 1em;
    width: 7em;
}


    #links #link dl dd {
        padding-left: 0;
    }
    #links #link dl {
        padding-left: 0;
        padding-right: 0;
    }

#inquiry #inq nav {
    width: 100%;
}
#inquiry #inq nav ul li {
    width: 6.5em;
    font-size: 12px;
}
#inquiry #inq table {
    width: 100%;
    margin-left: 0;
    margin-right: 0;
}
#inquiry #inq table th, #inquiry #inq table td {
    width: 100%;
    display: block;
    box-sizing: border-box;
}
   section#hy_whats h3, section#hy_description h4 {
    width: 100%;
    height: 49px;
    box-sizing: border-box;
    font-size: 1em;
    background-size: 150%;
    background-repeat: no-repeat;
    padding: 8px 20px 8px 35px;
}
section#hy_description a img {
    width: 100%;
    height: auto;
}