@charset 'utf-8';

/*--------------------
  HTML5 element display　
  --------------------*/
    article,
    aside,
    details,
    figcaption,
    figure,
    footer,
    header,
    hgroup,
    nav,
    section{
        display: block;
    }
    audio[controls],
    canvas,
    video{
        display: inline-block;
    }

/*--------------------
  Base
  --------------------*/
    *{
        box-sizing: border-box;
    }

    html{
        font-size: 16px;
        overflow-y: scroll;
        -webkit-overflow-scrolling: touch;
        -webkit-tap-highlight-color: rgba(0,0,0,0);
        -webkit-text-size-adjust: 100%;
        -ms-text-size-adjust: 100%;
    }
    body{
        text-align: center;
        margin: 0;
        font-size: 100%;
        line-height: 1.5;
        color: #26231d;
        font-family: "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN W3", HiraKakuProN-W3, "ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", -apple-system, BlinkMacSystemFont, "游ゴシック体", YuGothic, "Yu Gothic M", "游ゴシック Medium", "Yu Gothic Medium", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", "Helvetica Neue", HelveticaNeue, Helvetica, Arial, "Segoe UI", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
    }

/* Windows */
    @font-face{
        font-family: YuGothicM;
        font-weight: normal;
        src: local('YuGothic-Medium'), local('Yu Gothic Medium'), local('YuGothic-Regular');
    }
    @font-face{
        font-family: YuGothicM;
        font-weight: bold;
        src: local('YoGothic-Bold'), local('Yu Gothic');
    }

    body,
    button,
    input,
    select,
    textarea{
        color: #26231d;
    }

/*--------------------
  Typography
  --------------------*/
    b,
    strong{
        font-weight: normal;
        color: #b28c2b;
    }
    mark{
        background: none;
        color: #997824;
        font-style: normal;
        font-weight: normal;
    }
    small{
        font-size: 85%;
    }
    sub,
    sup{
        font-size: 75%;
        line-height: 0;
        position: relative;
        vertical-align: baseline;
    }
    sup{
        top: -0.5em;
    }
    sub{
        bottom: -0.25em;
    }

/*--------------------
  Embedded content
  --------------------*/
    img{
        border: 0;
        -ms-interpolation-mode: bicubic;
        vertical-align: bottom;
    }
    svg:not(:root){
        overflow: hidden;
    }

/*--------------------
  Figures
  --------------------*/
    figure{
        margin: 0;
    }

/*--------------------
  Forms
  --------------------*/
    form{
        margin: 0;
    }
    fieldset{
        border: 0;
        margin: 0;
        padding: 0;
    }
    legend{
        border: 0;
        padding: 0;
    }
    label{
        cursor: pointer;
    }
    button,
    input,
    select,
    textarea{
        font-size: 100%;
        margin: 0;
        vertical-align: baseline;
    }
    button,
    input{
        line-height: normal;
    }
    button,
    input[type="button"],
    input[type="reset"],
    input[type="submit"]{
        cursor: pointer;
        -webkit-appearance: button;
    }
    input[type="checkbox"],
    input[type="radio"]{
        box-sizing: border-box;
    }
    input[type="search"]{
        -moz-box-sizing: content-box;
        -webkit-box-sizing: content-box;
        box-sizing: content-box;
    }
    button::-moz-focus-inner,
    input::-moz-focus-inner{
        border: 0;
        padding: 0;
    }
    textarea{
        overflow: auto;
        vertical-align: top;
    }

/*--------------------
  Tables
  --------------------*/
    table{
        border-collapse: collapse;
        border-spacing: 0;
    }
    th,
    td{
        font-size: 1.2em;
        vertical-align: top;
    }
    th{
        font-weight: normal;
    }

/*--------------------
  links
  --------------------*/
    a{
        text-decoration: none;
        transition: .3s;
    }
    a:link,
    a:visited,
    a:hover,
    a:active{
        color: #d70c19;
    }
    a:focus{
        outline: none;
    }

/*--------------------
  text
  --------------------*/
    em{
        color: #C00;
        font-style: normal;
    }
    .bold{
        font-weight: bold;
    }

/*--------------------
  Heading
  --------------------*/
    h1,
    h2,
    h3,
    h4,
    h5,
    h6{
        margin-top: 0;
        margin-bottom: 0;
        font-family: "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN W3", HiraKakuProN-W3, "ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", -apple-system, BlinkMacSystemFont, "游ゴシック体", YuGothic, "Yu Gothic M", "游ゴシック Medium", "Yu Gothic Medium", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", "Helvetica Neue", HelveticaNeue, Helvetica, Arial, "Segoe UI", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
        font-weight: normal;
        line-height: 1.5;
        font-size: 1em;
    }

/*--------------------
  Grouping
  --------------------*/
    p{
        margin-top: 0;
        margin-bottom: 0;
    }
    pre{
        margin-top: 30px;
        padding: 15px;
        border: 1px solid #D5D5D5;
        text-indent: 0;
    }
    hr{
        display: block;
        height: 1px;
        border: 0;
        border-top: 1px solid #ccc;
        margin: 1em 0;
        padding: 0;
    }

/*--------------------
  Lists
  --------------------*/
    ul,
    ol,
    dl{
        margin: 0;
        padding: 0;
    }
    li{
        list-style: none;
    }
    dd{
        margin: 0;
    }
    ol li{
        list-style-position: inside;
        list-style-type: decimal;
        font-size: 1.2em;
    }
    li img{
        vertical-align: text-bottom;
    }

/*--------------------
  Non-semantic helper classes
  --------------------*/
    .cf:before,
    .cf:after{
        display: table;
        content: " ";
    }
    .cf:after{
        clear: both;
    }

@media screen and (min-width: 481px){
    a:hover{
        opacity: .5;
    }
}