@font-face {
    font-family: 'icoset';
    src: url("/cmn/css/fonts/icoset.eot?6gk8vv");
    src: url("/cmn/css/fonts/icoset.eot?6gk8vv#iefix") format("embedded-opentype"), url("/cmn/css/fonts/icoset.ttf?6gk8vv") format("truetype"), url("/cmn/css/fonts/icoset.woff?6gk8vv") format("woff"), url("/cmn/css/fonts/icoset.svg?6gk8vv#icoset") format("svg");
    font-weight: normal;
    font-style: normal
}

.strong {
    font-size: 18px;
    font-size: 1.8rem;
    font-weight: bold
}

.strong span {
    font-weight: bold
}

.strong.ttl {
    border-bottom-width: 1px;
    border-bottom-style: solid;
    line-height: 1.3;
    padding-bottom: 3px;
    margin-bottom: 15px
}

#footer {
    margin-top: 0
}

.pagetop {
    bottom: 0
}

.section {
    padding-top: 0
}

.section~.section {
    margin-top: 50px
}

.article-box~.article-box {
    margin-top: 100px
}

#content-wrap {
    padding: 0
}

#content-wrap #contents-cover {
    background: #e7e5d9 url(/cmn/manners/images/bg.png) repeat-y center 0;
    background-size: 100% auto;
    padding-left: 4%;
    padding-right: 4%;
    zoom: 1
}

#content-wrap #contents-cover:after {
    content: "";
    display: block;
    clear: both
}

#content-wrap #contents {
    width: 76%;
    background: #FFF;
    float: right;
    padding: 40px 0 120px 3%;
    height: 100%
}

#content-wrap aside {
    width: 24%;
    float: left;
    background: #e7e5d9;
    padding: 40px 2% 120px 0;
    height: 100%
}

.lh13 {
    line-height: 1.3 !important
}

.imgR,
.imgL,
.imgC {
    margin-top: 0.3em !important;
    margin-bottom: .3em
}

.imgR {
    float: right;
    margin-left: 15px
}

.imgL {
    float: left;
    margin-right: 15px
}

p.imgR,
p.imgL,
p.imgC {
    margin-top: .3em
}

p.imgR img,
p.imgL img,
p.imgC img {
    border: #f1f1f1 5px solid
}

img.imgR,
img.imgL {
    border: #f1f1f1 5px solid
}

figure.imgC {
    display: table;
    margin-left: auto;
    margin-right: auto;
    background: #efefef;
    border: #ccc 1px solid
}

figure.imgC figcaption {
    display: block;
    line-height: 1.3;
    padding: 5px
}

figure.imgL,
figure.imgR {
    max-width: 30%;
    background: #FFF;
    border: #ccc 1px solid;
    text-align: center
}

figure.imgL figcaption,
figure.imgR figcaption {
    display: block;
    padding: 5px;
    line-height: 1.3;
    font-size: 12px;
    font-size: 1.2rem;
    text-align: left;
    background: #efefef
}

figure.imgL img,
figure.imgR img {
    display: inline-block
}

.imgC {
    text-align: center
}

.imgC img {
    display: inline-block
}

.ttl-box .title {
    font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "ＭＳ Ｐ明朝", "MS PMincho", serif, Helvetica
}

.ttl-box.typeA {
    border-top-width: 1px;
    border-top-style: solid;
    border-bottom-width: 1px;
    border-bottom-style: solid;
    padding: 10px 0 8px
}

.ttl-box.typeA .title {
    display: inline-block;
    font-size: 30px;
    font-size: 3rem;
    line-height: 1.3;
    font-weight: bold
}

.ttl-box.typeB .title {
    font-size: 30px;
    font-size: 3rem;
    line-height: 1.3;
    font-weight: bold
}

.ttl-box.typeC {
    padding: 8px 15px 6px;
    margin-top: 2.2em
}

.ttl-box.typeC .title {
    font-size: 18px;
    font-size: 1.8rem;
    line-height: 1.3;
    font-weight: bold;
    color: #FFF
}

.ttl-box.typeB+.typeC {
    margin-top: 20px
}

.article {
    margin-top: 20px;
    line-height: 1.8
}

.article .text~.text {
    margin-top: 1.8em
}

.article .text {
    zoom: 1
}

.article .text:after {
    content: "";
    display: block;
    clear: both
}

.article .text p~p {
    margin-top: .8em
}

.article .text p~p.ttl {
    margin-top: 1.8em
}

.article .strong+p {
    margin-top: -0.2em !important
}

.article .idb {
    margin-top: 0
}

.article .idb dt,
.article .idb dd {
    line-height: 1.8;
    padding-top: 0
}

.article .col-wrap.block2 .box:nth-child(1) {
    padding-right: 15px;
    border-right: #ccc 1px dotted
}

.article .col-wrap.block2 .box:nth-child(2) {
    padding-left: 15px
}

.point {
    position: relative;
    padding-left: 1.3em;
    line-height: 1.3
}

.point:before {
    content: "\e905";
    font-family: icoset;
    line-height: 1;
    position: absolute;
    left: 0;
    top: 0
}

.tbl {
    margin-top: 24px
}

.tbl caption {
    font-size: 18px;
    font-size: 1.8rem;
    font-weight: bold;
    line-height: 1.3
}

.tbl th,
.tbl td {
    padding: 10px 10px;
    line-height: 1.3;
    text-align: left
}

.tbl th {
    width: 150px
}

.tbl th+th {
    width: auto
}

.arrows li~li {
    margin-top: 8px
}

.arrows a,
.arrows span.arr {
    display: inline-block;
    position: relative;
    line-height: 1.3;
    text-decoration: none !important;
    padding-left: 20px
}

.isOtherDevice .arrows a:hover,
.isOtherDevice .arrows span.arr:hover {
    text-decoration: underline !important
}

.arrows a:before,
.arrows span.arr:before {
    content: "\e900";
    font-family: icoset;
    font-weight: normal;
    line-height: 1;
    position: absolute;
    left: 0;
    top: 2px
}

.arrows2 li {
    margin-top: 16px;
    line-height: 1.3
}

.arrows2 li:first-child {
    margin-top: 0
}

.arrows2.box-wrap {
    margin-top: -16px
}

.arrows2.box-wrap .box {
    margin-top: 16px
}

.arrows2 a {
    text-decoration: none !important;
    display: block;
    padding-left: 16px;
    position: relative;
    line-height: 1.3
}

.arrows2 a:before {
    position: absolute;
    content: "\e914";
    font-family: icoset;
    color: #99920b;
    font-size: 12px;
    font-size: 1.2rem;
    line-height: 1;
    top: .2em;
    left: 0
}

.isOtherDevice .arrows2 a:hover {
    text-decoration: underline !important
}

#main-visual {
    background-repeat: no-repeat, repeat;
    background-position: right center, 0 0;
    background-size: auto 100%, auto auto
}

#main-visual .wrap {
    display: table;
    word-spacing: -1em;
    width: 100%;
    padding: 0 4%;
    max-width: none
}

#main-visual .cover {
    max-width: 1620px;
    margin: 0 auto
}

#main-visual .title,
#main-visual .thum {
    display: table-cell;
    word-spacing: normal
}

#main-visual .title {
    color: #FFF;
    width: 76%;
    padding-left: 2%
}

#main-visual .thum {
    width: 24%
}

#main-visual .thum span {
    display: block;
    margin-left: -17.8%
}

#main-visual .title,
#main-visual .thum {
    vertical-align: middle
}

#main-visual .page-title,
#main-visual .text {
    position: relative;
    z-index: 3
}

#main-visual .caption {
    display: inline-block;
    background: #FFF;
    border-radius: 50%;
    padding: 8px 20px;
    position: relative;
    margin-bottom: 10px;
    line-height: 1.3;
    font-size: 18px;
    font-size: 1.8rem
}

#main-visual .caption span {
    display: inline-block;
    position: relative;
    z-index: 2
}

#main-visual .caption:after {
    content: "";
    position: absolute;
    background: url(/cmn/manners/images/fukidasi.png) no-repeat 0 0;
    left: 28px;
    bottom: -8px;
    width: 19px;
    height: 20px;
    z-index: 1
}

#main-visual .page-title {
    font-size: 2vw;
    line-height: 1.3;
    font-weight: bold
}

#main-visual .category-name {
    font-size: 1vw;
}


#main-visual .text {
    margin-top: 5px;
    line-height: 1.3;
    font-size: 18px;
    font-size: 1.8rem
}

article.top #main-visual {
    background-repeat: repeat;
    background-position: 0 0;
    overflow: hidden;
    background-size: auto auto
}

article.top #main-visual .cover {
    background: none
}

article.top #main-visual .title,
article.top #main-visual .thum {
    width: 50%
}

article.top #main-visual .wrap {
    padding: 0 64px
}

article.top #main-visual .title {
    padding: 0
}

article.top #main-visual .page-title,
article.top #main-visual .text {
    margin-right: -50%
}

#side-nav .nav-box .title {
    text-align: center;
    position: relative
}

#side-nav .nav-box .title:after {
    content: "";
    position: absolute;
    top: 50%;
    left: 0;
    display: block;
    border-top: #d7d6bc 1px double;
    border-bottom: #d7d6bc 1px double;
    height: 2px;
    width: 100%;
    margin-top: -3px
}

#side-nav .nav-box .title span {
    display: inline-block;
    background: #e7e5d9;
    font-weight: bold;
    position: relative;
    z-index: 2;
    color: #99920b;
    padding: 0 .5em;
    font-size: 30px;
    font-size: 3rem
}

#side-nav .nav-box~.nav-box {
    margin-top: 50px
}

#side-nav .nav-list {
    margin-top: 16px
}

#side-nav .nav-list li {
    margin-top: 16px;
    line-height: 1.3
}

#side-nav .nav-list li:first-child {
    margin-top: 0
}

#side-nav .nav-list li a {
    text-decoration: none;
    display: block;
    padding-left: 16px;
    position: relative;
    line-height: 1.3
}

#side-nav .nav-list li a:before {
    position: absolute;
    content: "\e914";
    font-family: icoset;
    color: #99920b;
    font-size: 12px;
    font-size: 1.2rem;
    line-height: 1;
    top: .2em;
    left: 0
}

#side-nav .nav-list li a:hover {
    text-decoration: underline
}

#side-nav .bnr-list {
    margin-top: 50px
}

#side-nav .bnr-list li~li {
    margin-top: 25px
}

#keywords-area .keywords-box {
    border: #e6e6e6 3px solid;
    padding: 0 20px 20px;
    position: relative;
    margin-top: 20px;
    z-index: 3
}

#keywords-area .keywords-box:before {
    content: "";
    position: absolute;
    background: #fff;
    margin: 3px;
    border: 1px #e6e6e6 solid;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    display: block;
    z-index: -1
}

#keywords-area .title {
    background: #333;
    color: #FFF;
    font-weight: bold;
    display: inline-block;
    line-height: 1.3;
    padding: 6px 20px 5px;
    font-size: 18px;
    font-size: 1.8rem;
    top: -20px;
    position: relative
}

#keywords-area .title:after {
    content: "";
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 10px 10px 0 10px;
    border-color: #333 transparent transparent transparent;
    position: absolute;
    bottom: -8px;
    left: 30px
}

#keywords-area .keywrods-list {
    display: table;
    width: 100%;
    word-spacing: -1em;
    margin-top: -8px
}

#keywords-area .keywrods-list li {
    display: inline-block;
    word-spacing: normal;
    vertical-align: top;
    margin-top: 5px
}

#keywords-area .keywrods-list li:after {
    content: "／";
    margin-left: .5em;
    margin-right: .5em
}

#keywords-area .keywrods-list li:last-child:after {
    display: none
}

#keywords-area .keywrods-list a {
    display: inline-block;
    text-decoration: none
}

#keywords-area .keywrods-list a:hover {
    text-decoration: underline
}

#keywords-area .lead {
    margin-top: 30px;
    line-height: 1.8
}

.top .category-box {
    width: 105%;
    margin-left: -5%;
    margin-top: 20px
}

.top .category-box .box {
    width: 45%;
    margin-left: 5%
}

.top .category-box .box:nth-child(n+3) {
    margin-top: 50px
}

.top .category-box .img {
    display: block;
    position: relative;
    text-decoration: none;
    background: #333
}

.top .category-box .img .thum {
    overflow: hidden;
    display: block;
    position: relative
}

.isOtherDevice .top .category-box .img .thum:after {
    content: "一覧を見る \e902";
    font-family: icoset, "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "ＭＳ Ｐ明朝", "MS PMincho", serif, Helvetica;
    position: absolute;
    width: 100%;
    right: 0;
    bottom: -80px;
    padding: 6px 10px 6px;
    line-height: 1.3;
    color: #FFF;
    font-size: 18px;
    font-size: 1.8rem;
    background: rgba(44, 44, 44, 0.6);
    text-align: right;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    transition: .3s
}

.isOtherDevice .top .category-box .img:hover .thum:after {
    bottom: 0
}

.top .category-box .title {
    font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "ＭＳ Ｐ明朝", "MS PMincho", serif, Helvetica
}

.top .category-box .category-list {
    margin-top: 20px
}

.top .category-box .category-list li a {
    background: transparent
}

#feature-area {
    background: #f2f2f2;
    padding: 30px 5%
}

#feature-area .title {
    font-size: 30px;
    font-size: 3rem;
    line-height: 1.3;
    margin-bottom: 20px;
    font-weight: bold
}

#feature-area .feature-box a {
    display: table;
    width: 100%;
    word-spacing: -1em
}

#feature-area .feature-box~.feature-box {
    margin-top: 30px
}

#feature-area .feature-box .thum,
#feature-area .feature-box .feature-data {
    display: inline-block;
    vertical-align: top;
    word-spacing: normal
}

#feature-area .feature-box .thum {
    width: 12%
}

#feature-area .feature-box .feature-data {
    width: 88%;
    padding-left: 3%;
    color: #333
}

#feature-area .feature-box .feature-data h3 {
    font-weight: bold;
    font-size: 18px;
    font-size: 1.8rem;
    line-height: 1.3
}

#feature-area .feature-box .feature-data p {
    margin-top: .5em
}

#feature-area .feature-box a:hover .arr {
    color: #C83250;
    text-decoration: underline !important
}

.article-cat-box.box-wrap.block2 {
    width: 105%;
    margin-left: -5%
}

.article-cat-box.box-wrap.block2 .box {
    width: 45%;
    margin-left: 5%
}

.article-cat-box.box-wrap.block2 .box:nth-child(n+3) {
    margin-top: 50px
}

.article-cat-box .article-cat-list {
    margin-top: 12px
}

.column-box,
.relation-box {
    border: #f3f2e2 6px solid;
    padding: 20px 0;
    position: relative
}

.column-box .ttl,
.relation-box .ttl {
    background: #bab662;
    display: inline-block;
    padding: 10px 12px 8px;
    line-height: 1.3;
    font-weight: bold;
    color: #fff;
    position: relative;
    margin-left: -13px
}

.column-box .ttl:before,
.relation-box .ttl:before {
    content: "";
    position: absolute;
    bottom: -8px;
    left: 0;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 0 8px 8px 0;
    border-color: transparent #918e4c transparent transparent
}

.column-box .article,
.relation-box .article {
    padding: 0 5%
}

.column-box .article p~p,
.relation-box .article p~p {
    margin-top: .8em
}

.relation-box .relation-list a {
    color: #000 !important
}

.relation-box .relation-list a:hover {
    color: #c83250 !important
}

.column-box .caption {
    position: absolute;
    display: block;
    top: -12px;
    left: 5%;
    padding-left: 64px
}

.column-box .caption:before {
    content: "";
    background: url(/cmn/manners/images/ico_column.png) no-repeat 0 0;
    -webkit-background-size: 100% auto;
    -o-background-size: 100% auto;
    background-size: 100% auto;
    width: 59px;
    height: 20px;
    position: absolute;
    left: 0;
    top: 50%;
    margin-top: -14px;
    z-index: 2
}

.column-box .caption span {
    vertical-align: top;
    display: inline-block;
    background: #FFF;
    padding-right: 10px;
    font-family: 'Asap', sans-serif;
    font-size: 18px;
    font-size: 1.8rem;
    color: #bab662;
    position: relative;
    line-height: 1;
    margin-left: -20px;
    padding-left: 18px;
    z-index: 1
}

@media screen and (min-width: 0) and (max-width: 1560px) {
    #side-nav .nav-box .title span {
        font-size: 24px;
        font-size: 2.4rem;
        padding: 0 5px
    }
}

@media screen and (min-width: 0) and (max-width: 1360px) {
    #main-visual .cover {
        background-position: right -100px center
    }

    #main-visual .caption {
        font-size: 16px;
        font-size: 1.6rem
    }


    #side-nav .nav-box .title span {
        font-size: 20px;
        font-size: 2rem;
        padding: 0 5px
    }

    #side-nav .nav-box~.nav-box {
        margin-top: 30px
    }

    #side-nav .nav-list {
        margin-top: 12px
    }

    #side-nav .nav-list li {
        margin-top: 12px
    }

    #side-nav .nav-list li:first-child {
        margin-top: 0
    }

    #side-nav .nav-list li a:before {
        top: .25em;
        font-size: 10px;
        font-size: 1rem
    }

    #side-nav .bnr-list {
        margin-top: 30px
    }

    #side-nav .bnr-list li~li {
        margin-top: 15px
    }

    #side-nav .bnr-list li~li a {
        display: block;
        background: #FFF
    }
}

@media screen and (min-width: 0) and (max-width: 1199px) {
    #content-wrap #contents-cover {
        background: #e7e5d9 url(/cmn/manners/images/bg2.png) repeat-y center 0;
        background-size: 100% auto;
        padding-left: 1.5%;
        padding-right: 1.5%
    }

    #content-wrap #contents {
        padding-right: 1%
    }

    #content-wrap aside {
        padding-right: 1%
    }

    #main-visual .wrap {
        padding: 0 1.5%
    }

    article.top #main-visual .wrap {
        padding: 0 32px
    }
}

@media screen and (min-width: 0) and (max-width: 980px) {
    .arrows2 {
        margin-top: 12px
    }

    .arrows2 li {
        margin-top: 12px
    }

    .arrows2 li:first-child {
        margin-top: 0
    }

    .arrows2 a:before {
        top: .25em;
        font-size: 10px;
        font-size: 1rem
    }
}

.isTablet .section~.section {
    margin-top: 30px
}

.isTablet .article-box~.article-box {
    margin-top: 50px
}

.isTablet #content-wrap #contents {
    padding-left: 2%
}

.isTablet .ttl-box.typeA {
    padding: 8px 0 6px
}

.isTablet .ttl-box.typeA .title {
    font-size: 24px;
    font-size: 2.4rem
}

.isTablet .ttl-box.typeB .title {
    font-size: 24px;
    font-size: 2.4rem
}

.isTablet .ttl-box.typeC {
    padding: 8px 15px 6px;
    margin-top: 15px
}

.isTablet .ttl-box.typeC .title {
    font-size: 16px;
    font-size: 1.6rem
}

.isTablet .article {
    margin-top: 20px;
    line-height: 1.8
}

.isTablet .tbl.switch th,
.isTablet .tbl.switch td {
    display: block
}

.isTablet .tbl.switch tr:nth-child(n+2) th,
.isTablet .tbl.switch th+td {
    border-top: none
}

.isTablet .arrows2 {
    margin-top: 12px
}

.isTablet .arrows2 li {
    margin-top: 12px
}

.isTablet .arrows2 li:first-child {
    margin-top: 0
}

.isTablet .arrows2 a:before {
    top: .3em;
    font-size: 10px;
    font-size: 1rem
}

.isTablet #main-visual .cover {
    background-position: right -100px center
}

.isTablet #main-visual .wrap {
    padding: 0 15px !important
}


.isTablet article.top #main-visual .caption {
    padding: 6px 20px;
    margin-bottom: 5px;
    font-size: 14px;
    font-size: 1.4rem
}


.isTablet #side-nav .nav-box .title span {
    padding: 0 .3em;
    font-size: 16px;
    font-size: 1.6rem
}

.isTablet #side-nav .nav-box~.nav-box {
    margin-top: 30px
}

.isTablet #side-nav .nav-list a:before {
    top: .3em
}

.isTablet #side-nav .bnr-list {
    margin-top: 30px
}

.isTablet #side-nav .bnr-list li~li {
    margin-top: 10px
}

.isTablet #keywords-area .title {
    font-size: 16px;
    font-size: 1.6rem
}

.isTablet .top .category-box .img {
    background: #fff
}

.isTablet #feature-area {
    padding: 20px 3%
}

.isTablet #feature-area .title {
    font-size: 24px;
    font-size: 2.4rem;
    margin-bottom: 15px
}

.isTablet #feature-area .feature-box a .feature-data h3 {
    font-size: 16px;
    font-size: 1.6rem
}

.isTablet #feature-area .feature-box a .feature-data p {
    margin-top: .3em
}

.isTablet .column-box,
.isTablet .relation-box {
    padding: 15px 0
}

.isTablet .column-box .article,
.isTablet .relation-box .article {
    padding: 0 3%
}

/*# sourceMappingURL=../map/sd.manners.min.css.map */