@import url(//fonts.googleapis.com/css?family=Open+Sans:400,400italic,600,600italic,700,700italic);

@media screen and (min-width: 641px) {
    body {
        font-family: Avenir, "Open Sans", "Helvetica Neue", Helvetica, Arial, Verdana, Roboto, "游ゴシック", "Yu Gothic", "游ゴシック体", "YuGothic", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "Meiryo UI", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
        line-height: 1.7;
        letter-spacing: 0.1em;
        color: #67360e;
        min-width: 1200px;
    }

    a:link {
        color: #67360e;
        text-decoration: none;
    }

    a:visited {
        color: #2b1708;
        text-decoration: none;
    }

    a:hover {
        color: #2b1708;
        text-decoration: underline;
    }

    a:active {
        color: #67360e;
        text-decoration: underline;
    }

    .clear:after {
        visibility: hidden;
        display: block;
        font-size: 0;
        content: " ";
        clear: both;
        height: 0;
    }

    * html .clear {
        zoom: 1;
    }

    /* IE6 */
    *:first-child + html .clear {
        zoom: 1;
    }

    /* IE7 */

    a:hover img {
        filter: alpha(opacity=80);
        -moz-opacity: 0.8;
        opacity: 0.8;
    }

    /* background */
    #outer {
        background: #f7f4e5;
        margin: auto;
    }

    #container {
        background: #f7f4e5;
        max-width: 1200px;
        margin: auto;
    }

    #content {
        width: 960px;
        margin: 20px auto;
    }

    /* page header */
    header#page-header {
        width: 960px;
        margin: auto;
        background: #f7f4e5;
    }

    #header-left {
        float: left;
        width: 320px;
        margin: 0 10px;
    }

    #header-right {
        float: right;
        width: 600px;
        margin: 0 10px;
        text-align: right;
    }

    #g-nav ul,
    #footer-g-nav ul {
        text-align: center;
    }


    h1#mast-head {
        text-align: right;
        font-size: 11px;
        margin-top: 10px;
    }

    #tel {
        margin: 10px 0;
    }

    #logo {
        margin-top: 20px;
    }

    #g-nav,
    #footer-g-nav {
        background: url(../images/g-navBg.jpg) 0 0 repeat-x;
        height: 60px;
    }

    #g-nav li,
    #footer-g-nav li {
        display: inline-block;
        padding: 0 20px 0 23px;
        margin-top: 20px;
        border-left: 2px solid #fff;
        height: 20px;
        line-height: 20px;
        color: #fff;
    }

    #g-nav li.lastchild,
    #footer-g-nav li.lastchild {
        border-right: 2px solid #fff;
    }

    #g-nav li a,
    #footer-g-nav li a {
        color: #fff;
        font-weight: 600;
        text-decoration: none;
        display: block;
    }

    #g-nav li a:hover,
    #footer-g-nav li a:hover {
        color: #76b047;
    }

    /* sidebar */
    #sidebar {
        float: left;
        width: 220px;
    }

    #sidebar img {
        max-width: 220px;
    }

    /* main */
    main {
        float: right;
        width: 700px;
    }

    .page {
        margin-bottom: 10px;
    }

    #main-spalash {
        box-shadow: 0 0 5px rgba(120, 120, 120, .2);
    }

    #main-splash img {
        max-width: 700px;
    }

    #main-nav {
        margin: 20px 0;
    }

    #main-nav li {
        float: left;
    }

    #main-subnav {
        margin: 20px 0;
    }

    #main-subnav li {
        width: 350px;
        float: left;
        margin: 0;
        padding: 0;
        line-height: 1;
        height: 249px;
    }


    /* TOPコース紹介 */
    #course {
        border-radius: 10px;
        background: #fff;
        padding: 20px;
        width: 660px;
        box-shadow: 0 0 5px rgba(120, 120, 120, .2);
        margin-bottom: 20px;
    }

    #course h1 {
        text-align: left;
        font-size: 22px;
        font-weight: 600;
    }

    #course h1 span {
        text-align: right;
        font-size: 12px;
        margin-left: 60px;
    }

    #course dt {
        text-align: center;
        color: #fff;
        background: #f8b13d;
        width: 80px;
        height: 25px;
        line-height: 25px;
        text-align: center;
        margin-bottom: 10px;
        font-weight: 600;
    }

    #course dd {
        text-align: left;
    }

    #course dl {
        position: relative;
        padding-bottom: 20px;
    }

    #course dd.s-get {
        position: absolute;
        bottom: 20px;
        right: 0;
        background: #4d4d4d;
        color: #fff;
        padding: 4px 8px;
    }

    #course dd.s-get a {
        color: #fff;
        text-decoration: none;
    }

    #course dd.s-get:hover {
        background: #666;
    }

    #course dd.s-title {
        font-weight: 600;
    }


    #course dd.f-title {
        font-weight: 600;
    }

    .f-detail {
        font-size: small;
    }

    /* ranking */
    #special {
        border-radius: 10px;
        background: #fff;
        padding: 20px;
        width: 660px;
        box-shadow: 0 0 5px rgba(120, 120, 120, .2);
        margin-bottom: 40px;
    }

    #special h1 {
        text-align: left;
        font-size: 22px;
        font-weight: 600;
    }

    #special h1 span {
        text-align: right;
        font-size: 12px;
        margin-left: 60px;
    }

    #special dt {
        text-align: center;
        color: #fff;
        background: #f8b13d;
        width: 80px;
        height: 25px;
        line-height: 25px;
        text-align: center;
        margin-bottom: 10px;
        font-weight: 600;
    }

    #special dd {
        text-align: left;
    }

    #special dl {
        margin: 20px 0 0 0;
        position: relative;
        padding-bottom: 20px;
        border-top: 1px dotted #67360e;
    }

    #special dd.s-get {
        position: absolute;
        bottom: 20px;
        right: 0;
        background: #4d4d4d;
        color: #fff;
        padding: 4px 8px;
    }

    #special dd.s-get a {
        color: #fff;
        text-decoration: none;
    }

    #special dd.s-get:hover {
        background: #666;
    }

    #special dd.s-title {
        font-weight: 600;
    }


    #special dd.f-title {
        font-weight: 600;
    }

    .f-detail {
        font-size: small;
    }

    /* 予約 */
    #reserve li {
        float: left;
    }

    #reserve li + li {
        float: right;
    }

    /* footer */
    #footer-inner {
        width: 960px;
        margin: 20px auto;
    }

    .footer-cont {
        float: left;
        width: 330px;
        margin: 0 10px;
        min-height: 300px;
    }

    .footer-cont img {
        width: 100%;
    }

    .footer-cont + .footer-cont {
        padding-left: 20px;
        width: 250px;
        border-left: 1px solid #67360e;
    }

    .footer-cont h1 img {
        width: 150px;
        height: auto;
    }

    .footer-cont dt {
        float: left;
        font-size: 12px;
        text-align: left;
    }

    .footer-cont dd {
        width: 240px;
        padding-right: 10px;
        text-align: left;
        font-size: 12px;
        float: right;
    }

    .footer-cont dd .note {
        font-size: 10px;
        font-weight: 600;
        display: inline-block;
    }

    .footer-cont li {
        list-style: none;
        padding-left: 30px;
        background: url(../images/f-li.jpg) left center no-repeat;
    }

    #copyright {
        margin: 40px 0 10px 0;
        text-align: center;
        font-size: 12px;
    }

    /* sidebar */
    .bnr h2 {
        line-height: 50px;
        height: 50px;
        width: 220px;
        color: #fff;
        background: #3e6829;
        font-size: 16px;
        text-align: center;
        letter-spacing: 0 !important;
        font-weight: 600;
    }

    .bnr {
        margin-bottom: 10px;
    }

    /* menu page
----------------------------------------------- */
    #menu-title {
        margin-bottom: 15px;
        background: url(../images/menu01.jpg) 0 0 no-repeat;
        width: 700px;
        height: 51px;
        text-indent: -9999px;
    }

    #menu h3 {
        font-size: 26px;
        font-weight: 100;
        margin-bottom: 10px;
    }

    #menu-list dl {
        background: #fff;
        width: 324px;
        padding: 30px 10px;
        border-radius: 10px;
        -moz-border-radius: 10px;
        -webkit-border-radius: 10px;
        float: left;
        margin-right: 12px;
        margin-bottom: 20px;
    }


    #menu-list dl.odd {
        margin-right: 0;
    }

    #menu-list dt {
        color: #c01e36;
        margin-bottom: 14px;
        background-color: #f9f8f7;
    }

    #menu-list dd {
        text-align: left;
    }

    #price-list {
        margin: 30px 0 20px 0;
        height: 36px;
        background: url(../images/menu02.jpg) 0 0 no-repeat;
        text-indent: -9999px;
    }

    #price-list-area dl {
        margin-bottom: 5px;
    }

    #price-list-area dt {
        width: 700px;
        float: left;
        text-align: left;
    }

    #price-list-area dd {
        float: right;
        text-align: right;
    }

    #price-list-area dd {
        float: right;
        text-align: right;
    }

    #price-list-area txt_dono {
        float: left;
        text-align: left;
        font-weight: 600;
    }

    .txt_dono {
        font-weight: 600;
        border-bottom: 1px solid #67360e;
        padding-bottom: 5px;
    }

    .rank {
        color: #ffffff;
        background-color: #fbb03b;
    }

    #note-area {
        border-top: 1px dotted #67360e;
        padding: 25px 0;
        margin-top: 10px;
    }

    #note-area li:before {
        content: "◆";
    }

    .yomogimushi .b-w {
        border-right: 10px solid #f7f4e5;
        background-color: #f9f8f7;
        margin-top: 10px;
        padding: 2px 10px;
        font-weight: bold;
        border-top-right-radius: 30px;
        border-top-left-radius: 30px;
    }

    p.note {
        font-size: 14px;
    }

    .note {
        font-size: 14px;
        border-right: 10px solid #f7f4e5;
        border-bottom: 10px solid #f7f4e5;
        vertical-align: top;
        padding: 0 10px 10px 10px;
        background-color: #f7f4e5;
        border-bottom-right-radius: 30px;
        border-bottom-left-radius: 30px;
    }

    .note p {
        margin-bottom: 20px;
    }

    .note p + p {
        margin-bottom: 0;
    }

    .title_note {
        border-bottom: 1px solid #67360e;
    }

    /* メニュー白枠
---------------------------- */
    .menu_note {
        font-size: 14px;
        border-right: 10px solid #f7f4e5;
        border-bottom: 10px solid #f7f4e5;
        vertical-align: top;
        padding: 0 10px 10px 10px;
        background-color: #fff;
        border-bottom-right-radius: 30px;
        border-bottom-left-radius: 30px;
    }

    .menu_note p {
        margin-bottom: 20px;
    }

    .menu_note p + p {
        margin-bottom: 0;
    }

    .menu_title_note {
        border-bottom: 1px solid #67360e;
    }

    .box {
        padding: 0.5em 1em;
        margin: 0.5em auto 2em;
        /*	font-weight: bold;*/
        color: #67360e;
        /*文字色*/
        background: #f9f8f7;
        border: solid 3px #006837;
        /*線*/
        border-radius: 10px;
        /*角の丸み*/
    }

    .box p {
        margin: 0;
        padding: 0;
    }

    /* 施術の流れ
---------------------------- */
    #flow-title {
        background: url(../images/flow1.jpg) 0 0 no-repeat;
        height: 49px;
        text-indent: -9999px;
        margin-bottom: 30px;
    }

    #flow .lead {
        margin-bottom: 30px;
    }

    .step {
        width: 700px;
        float: left;
    }

    p .hidari {
        float: left;
        margin-right: 2em;
        margin-bottom: 1em;
    }

    /* アクセス
---------------------------- */
    #access-title {
        background: url(../images/access01.jpg) 0 0 no-repeat;
        height: 49px;
        text-indent: -9999px;
        margin-bottom: 30px;
    }

    #access .lead {
        margin-bottom: 30px;
    }

    #photo {
        width: 700px;
        float: left;
    }

    #photo dl {
        width: 220px;
        float: left;
    }

    #photo figure {
        width: 100%;
        height: auto;
        margin: 0;
        padding: 0;
    }

    #photo figure img {
        width: 210px;
        height: auto;
    }

    #photo figurecaption {
        background: #a0c5e2;
        padding: 2px 10px;
        text-align: left;
        display: block;
        width: 100%;
        box-sizing: border-box;
        font-weight: 800;
        color: #12529f;
    }


    #photo dd {
        text-align: left;
        padding: 5px;
        font-size: 12px;
    }

    /* お客様の声
---------------------------- */
    #voice-title {
        background: url(../images/voice01.jpg) 0 0 no-repeat;
        height: 49px;
        text-indent: -9999px;
        margin-bottom: 30px;
    }

    .borderBox {
        padding: 10px;
        margin-bottom: 20px;
    }

    .borderBox.photo li {
        float: left;
        width: 31.3333%;
        height: auto;
        padding: 0 1%;
    }

    .borderBox.photo li img {
        width: 210px;
        height: auto;
    }

    .txt_green600 {
        font-weight: 800;
        color: #006837;
    }


    /* ふぁおんのよもぎ蒸しとは
---------------------------- */

    #faon-list dl {
        background: #fff;
        width: 700px;
        padding: 30px 10px;
        border-radius: 10px;
        -moz-border-radius: 10px;
        -webkit-border-radius: 10px;
        float: left;
        margin-right: 12px;
        margin-bottom: 20px;
    }


    #faon-list dl.odd {
        margin-right: 0;
    }

    #faon-list dt {
        color: #3a5a98;
        font-size: 18px;
        margin-bottom: 14px;
    }



    /* よくある質問
---------------------------- */
    #qa-title {
        background: url(../images/qa.jpg) 0 0 no-repeat;
        height: 49px;
        text-indent: -9999px;
        margin-bottom: 30px;
    }

    #qa dt {
        color: #fff;
        background: #f8b13d;
        width: 660px;
        height: 25px;
        line-height: 25px;
        margin-bottom: 10px;
        font-weight: 600;
        padding-left: 20px;
    }

    #qa dd {
        text-align: left;
    }

    #qa dl {
        margin: 20px 0 0 0;
        position: relative;
        padding-bottom: 20px;
    }


    #qa dd.s-title {
        font-weight: 600;
    }

    #qa dd.s-detail {
        font-size: small;
    }

    /* お問い合わせ
---------------------------- */
    #mail-title {
        background: url(../images/mail.jpg) 0 0 no-repeat;
        height: 49px;
        text-indent: -9999px;
        margin-bottom: 30px;
    }

    #formWrap {
        width: 700px;
        margin: 20px auto;
        color: #555;
        line-height: 120%;
    }

    table.formTable {
        width: 90%;
        margin: 0 auto;
        border-collapse: collapse;
    }

    table.formTable td,
    table.formTable th {
        border: 1px solid #ccc;
        padding: 10px;
        font-size: 14px;
    }

    table.formTable th {
        width: 30%;
        background: #f2e4e4;
        text-align: left;
    }

    .kome {
        color: red;
        font-size: 14px;
    }

    .sp {
        display: none;
    }

    /*新着情報*/
    .top-news {
        background-color: #fff;
        margin-bottom: 10px;
    }

    .top-news li {
        padding: 10px 20px 6px 20px;
        border-bottom: 1px solid #76b047;
    }
}