@charset "utf-8";
/* -------------------------- */
/* Basic part css             */
/* PC device width: 769px */
/* SMAPH device width: 768px  */
/* font size use "rem"        */
/* Key color #840222          */
/* -------------------------- */


body {
    background: #fff;
    font-size: 1.3rem;
	-webkit-text-size-adjust: 100%;
}

body > * {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}
*, *:before, *:after {
  -webkit-box-sizing: border-box;
  box-sizing: border-box
}

/* ------------------------------------------------------------- start PC */

@media (min-width: 769px) {

    .drawer-nav,
#mobile-menu,
.sdonly {
        display: none !important;
    }

    .inside {
        max-width: 1160px;
        margin: 0 auto;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
    }

    i {
        margin: 0 4px 0 0;
    }


/* ------------------------------------ header */

    header .headline {
        color: #fff;
        background: #6f0318;
        font-weight: bold;
        padding: 10px 0;
    }

    header .headline .inside.tablewrap ul {
        width: 840px;
        text-align: right;
    }

    header .headline .inside.tablewrap ul li {
        display: inline-block;
        padding: 0 0 0 1em;
    }

    header .headline .inside.tablewrap ul li a {
        color: #fff;
    }

    header .headline .inside.tablewrap ul li strong {
        margin: 0 0 0 0.5em;
    }

    header .headline .inside.tablewrap ul li small {
        font-size: 1.2rem;
        font-weight: normal;
    }

    header > div:not(.headline) {
        padding: 12px 0;
    }

    header .logo img {
        width: 164px;
        height: auto;
        vertical-align: middle;
    }

    header .logo + ul {
        text-align: right;
    }

    header .logo + ul li {
        display: inline-block;
        width: 156px;
    }

    header .logo + ul li a {
        display: block;
        font-weight: bold;
        padding: 11px 0 9px;
    }

/* breadcrumb ( underlayer ) */

    #breadcrumb {
		max-width: 1160px;
        margin: 0 auto;
        padding: 0 0 12px;
    }

    #breadcrumb li {
        display: inline-block;
    }

    #breadcrumb li:not(.current)::after {
        display: inline-block;
        content: '>';
        margin: 0 0.6em;
        color: #333;
    }

    #breadcrumb li a {
        color: #333;
    }

/* ------------------------------------ menu */
    #menu {
        margin: 0 auto;
        padding: 0;
    }

    #menu li {
        display: block;
        float: left;
        width: 150px;
        margin: 0;
        margin-right:5px;
        padding: 0;
    }

    #menu li a {
        display: block;
        padding: 10px 0;
        /*background-color: #94484a;
        color: #fff;*/
        background-color: #f3f2f5;
        color: #6f0318;
        text-align: center;
        text-decoration: none;
        border: 1px solid #6f0318;
        border-radius: 5px 5px 0 0;
        -webkit-border-radius: 5px 5px 0 0;
        -moz-border-radius: 5px 5px 0 0;
        border-bottom: none;
    }

    #menu li a:hover {
        background: #6f0318;
        color: #fff;
    }

    #menu li.active a {
        background: #6f0318;
        color: #fff;
    }

/* ------------------------------------ footer */

    footer {
        color: #fff;
        background: #6f0318;
        text-align: center;
        padding: 50px 0;
    }

    footer ul {
        margin: 0 0 20px;
    }

    footer ul li {
        display: inline-block;
        border-left: 1px #fff solid;
        padding: 0 1em;
    }

    footer ul li a {
        color: #fff;
        font-weight: bold;
    }

    footer ul li:first-child {
        border-left: none;
    }

    footer p {
        display: none;
    }

    footer aside {
        font-size: 1.2rem;
    }

/* ------------------------------------ main */

    main {
        display:block;
        padding: 24px 36px;
    }

    main > .inside {
        overflow: hidden;
    }

/* archive */

    main > .inside > #mainbar {
        float: right;
        width: 880px;
    }

    main > .inside > #sidebar {
        float: left;
        width: 230px;
    }
}
/* end PC */


/* ------------------------------------------------------------------------- start MOBILES */

@media (max-width: 768px) {

    header .headline,
header > div:not(.headline) ul,
.pconly {
        display: none !important;
    }

    .inside {
        padding: 0 13px;
    }

    i {
        margin: 0 4px 0 0;
    }

/* ------------------------------------ header */

    header {
        border-top: 4px #231762 solid;
        padding: 8px 0 12px;
    }

    header .inside.tablewrap {
        display: table;
        width: 100%;
        padding: 0 10px 0 16px;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
    }

    header .inside.tablewrap > * {
        display: table-cell;
        vertical-align: middle;
    }

    header .logo img {
        width: 160px;
        height: auto;
    }

    header #mobile-menu {
        text-align: right;
    }

    header #mobile-menu > * {
        display: inline-block;
    }

    header #mobile-menu dt a {
        display: block;
        color: #ff6600;
        font-size: 3.2rem;
        margin: 0 8px 0 0;
    }

    header #mobile-menu dd a {
        display: block;
        color: #8f8f8f;
        font-size: 3.6rem;
    }

/* ------------------------------------ footer */

    footer {
        color: #fff;
        background: #6f0318;
        text-align: center;
        padding: 24px 0 32px;
    }

    footer ul.footer_menu {
        display: none;
    }

    footer p {
        line-height: 1.5;
        margin: 0 0 12px;
    }
    footer p span {
        display: block;
        font-weight: bold;
        font-size: 1.5rem;
        padding: 0.55rem 0;
    }
    footer p span a {
        color: #fff;
    }

    footer aside {
        font-size: 1.2rem;
    }

	/* #wrapper { padding: 16px 0; } */
	/* #container.home #wrapper { padding: 16px 0; } */

	/* breadcrumb ( underlayer ) */
    #breadcrumb {
        display: none;
    }
}
/* end MOBILES */
