@charset "utf-8";
/*! sanitize.css | CC0 Public Domain | github.com/jonathantneal/sanitize.css */
pre,textarea{overflow:auto}
[hidden],audio:not([controls]),template{display:none}
details,main,summary{display:block}
input[type=number]{width:auto}
input[type=search]{-webkit-appearance:textfield}
input[type=search]::-webkit-search-cancel-button,input[type=search]::-webkit-search-decoration{-webkit-appearance:none}
progress{display:inline-block}
textarea{resize:vertical}
[unselectable]{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}
*,::after,::before{box-sizing:inherit;border-width:0}
*{font-size:inherit;line-height:inherit;margin:0;padding:0}
::after,::before{text-decoration:inherit;vertical-align:inherit}
:root{-ms-overflow-style:-ms-autohiding-scrollbar;overflow-y:scroll;-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%;text-size-adjust:100%;cursor:default;}
a{text-decoration:none;outline:none;}
audio,canvas,iframe,img,svg,video{vertical-align:top}
img{border:none;}
canvas{width:0;height:0}
button,input,select,textarea{background-color:transparent;color:inherit;font-family:inherit;font-style:inherit;font-weight:inherit;min-height:1.5em}
button:focus,input:focus,select:focus,textarea:focus{outline:none;}
code,kbd,pre,samp{font-family:monospace,monospace}
ol,ul{list-style:none}
select{-moz-appearance:none;-webkit-appearance:none}
select::-ms-expand{display:none}
select::-ms-value{color:currentColor}
table{border-collapse:collapse;border-spacing:0}
::-moz-selection{background-color:#B3D4FC;text-shadow:none}
::selection{background-color:#B3D4FC;text-shadow:none}
@media screen{[hidden~=screen]{display:inherit}
[hidden~=screen]:not(:active):not(:focus):not(:target){clip:rect(0 0 0 0)!important;position:absolute!important}
}
html
{
    font-size: 62.5%;
    height: 100%;
}

*
{
    -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
            box-sizing: border-box;
    max-height: 99999px;

    -webkit-tap-highlight-color: rgba(0,0,0,0);
}

input,
textarea
{
    display: block;
}

[class*='mdi-']:before
{
    font-family: 'Material Design Icons';
    font-weight: normal;
    font-style: normal;
    font-variant: normal;
    line-height: 1;
    display: inline-block;
    vertical-align: middle;
    white-space: nowrap;
    letter-spacing: normal;
    text-transform: none;
    word-wrap: normal;

    direction: ltr;
    speak: none;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    font-feature-settings: 'liga';
}

body
{
    font: 10px/1.75 '-apple-system', BlinkMacSystemFont, 'Helvetica Neue', 'Segoe UI', 'Yu Gothic', YuGothic, Verdana, Meiryo, 'M+ 1p', sans-serif;
    height: 100%;
    letter-spacing: .05em;

    -webkit-text-size-adjust: 100%;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

body a.mdi-window-close
{
    display: none;
}

body > header
{
    position: relative;
    height: 40px;
    background: #000;
}

body > header h1
{
    position: absolute;
    top: 12px;
    left: 50%;
    width: 131px;
    margin-left: -66px;
    -webkit-transform: translate3d(0, 0, 0);
       -moz-transform: translate3d(0, 0, 0);
        -ms-transform: translate3d(0, 0, 0);
         -o-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0);
}

body > header h1:before
{
    position: absolute;
    top: -9999px;
    content: 'LIFEのBOOK ほぼ日手帳';
    color: #000;
}

body > header > a
{
    position: absolute;
    top: 0;
    left: 0;
    overflow: hidden;
    width: 40px;
    height: 40px;
    color: #fff;
}

body > header > a:before
{
    font-size: 24px;
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
       -moz-transform: translate(-50%, -50%);
        -ms-transform: translate(-50%, -50%);
         -o-transform: translate(-50%, -50%);
            transform: translate(-50%, -50%);
}

body > footer
{
    height: 121px;
    padding-top: 19px;
    text-align: center;
}

body > footer a.mdi-arrow-left
{
    display: inline-block;
    color: #509be5;
}

body > footer a.mdi-arrow-left:before
{
    font-size: 24px;
}

body > footer a.mdi-arrow-left span
{
    font-size: 16px;
    font-weight: bold;
    line-height: 1.5;
    display: inline-block;
    vertical-align: middle;
}

body > footer small
{
    font-weight: bold;
    display: block;
    margin-top: 30px;
    padding-top: 13px;
    border-top: #e5e5e5 1px solid;
}

#page
{
    min-height: calc(100% - 121px - 40px);
    padding: 0 3.13%;
    text-align: center;
}

#page section:nth-of-type(1)
{
    display: block;
}

#page section:nth-of-type(1) ~ section
{
    display: none;
    -webkit-transition: opacity .45s cubic-bezier(.25, .46, .45, .94);
       -moz-transition: opacity .45s cubic-bezier(.25, .46, .45, .94);
        -ms-transition: opacity .45s cubic-bezier(.25, .46, .45, .94);
         -o-transition: opacity .45s cubic-bezier(.25, .46, .45, .94);
            transition: opacity .45s cubic-bezier(.25, .46, .45, .94);
    opacity: 0;
}

#page section header h2
{
    margin-bottom: 2em;
    padding: 1.7em 0 .4em;
    border-bottom: #e5e5e5 .1em solid;
}

#page section header h2 span
{
    font-size: 16px;
    font-weight: bold;
    line-height: 1.31;
    display: inline-block;
    text-align: left;
    letter-spacing: .05em;
}

#page section > p
{
    font-size: 14px;
    line-height: 1.5; /*br
        display none*/
    display: inline-block;
    padding-top: .8em;
    text-align: left;
}

#page section > dl
{
    position: relative;
    padding: 0 0 3.2em 10em;
    text-align: left;
}

#page section > dl:after
{
    display: inline-block;
    height: 7.5em;
    content: '';
    vertical-align: middle;
}

#page section > dl dd
{
    position: absolute;
    top: 0;
    left: 0;
    width: 7.5em;
    height: 7.5em;
}

#page section > dl dd img
{
    position: absolute;
    width: 100%;
    height: 100%;
}

#page section > dl dt
{
    font-size: 16px;
    font-weight: bold;
    line-height: 1.2;
    display: inline-block;
    vertical-align: middle;
}

#page form
{
    text-align: left;
}

#page form.disabled > a
{
    cursor: default;
    pointer-events: none;
    opacity: 1 !important;
    color: #808080;
    background: #ccc;
}

#page form > p
{
    font-size: 14px;
    line-height: 1.5;
}

#page form > p br
{
    display: none;
}

#page form > input[type='text']
{
    display: none;
}

#page form > a
{
    display: block;
    margin: 2.8em auto 0;
    cursor: pointer;
    -webkit-transition: background .3s, color .3s, opacity .3s !important;
       -moz-transition: background .3s, color .3s, opacity .3s !important;
        -ms-transition: background .3s, color .3s, opacity .3s !important;
         -o-transition: background .3s, color .3s, opacity .3s !important;
            transition: background .3s, color .3s, opacity .3s !important;
    text-align: center;
    color: #fff;
    -webkit-border-radius: 6px;
            border-radius: 6px;
    background: #509be5;
}

#page form > a:after
{
    display: inline-block;
    height: 5.6em;
    content: '';
    vertical-align: middle;
}

#page form > a span
{
    font-size: 16px;
    font-weight: bold;
    display: inline-block;
    vertical-align: middle;
}

#page form fieldset.error p
{
    visibility: visible;
}

#page form fieldset.error input,
#page form fieldset.error textarea
{
    background: rgba(230,0,0,.1);
}

#page form fieldset.excess legend span
{
    color: #e60000;
}

#page form fieldset.excess input + p:before
{
    content: 'ニックネームは15文字まででお願いします。';
}

#page form fieldset.excess textarea + p:before
{
    content: 'コメントは100文字まででお願いします。';
}

#page form fieldset legend
{
    font-size: 16px;
    font-weight: bold;
    line-height: 1.75;
    padding-bottom: .19em;
}

#page form fieldset legend span
{
    -webkit-transition: color .3s;
       -moz-transition: color .3s;
        -ms-transition: color .3s;
         -o-transition: color .3s;
            transition: color .3s;
    color: #000;
}

#page form fieldset input,
#page form fieldset textarea
{
    -webkit-transition: background .3s;
       -moz-transition: background .3s;
        -ms-transition: background .3s;
         -o-transition: background .3s;
            transition: background .3s;
    background: rgba(230,0,0,0);
}

#page form fieldset input
{
    font-size: 14px;
    line-height: 1.5;
    width: 100%;
    padding: .5em;
    border: 1px #000 solid;
    -webkit-border-radius: 4px;
            border-radius: 4px;
}

#page form fieldset input + p:before
{
    content: 'ニックネームを入力してください。';
}

#page form fieldset textarea
{
    font-size: 14px;
    line-height: 1.5;
    width: 100%;
    height: 10em;
    padding: .5em;
    resize: none;
    border: 1px #000 solid;
    -webkit-border-radius: 4px;
            border-radius: 4px;
}

#page form fieldset textarea + p:before
{
    content: 'コメントを入力してください。';
}

#page form fieldset p
{
    font-size: 14px;
    line-height: 1.5;
    visibility: hidden;
    padding-bottom: .5em;
    color: #e60000;
}

#page form fieldset ul:before,
#page form fieldset ul:after
{
    display: table;
    content: '';
}

#page form fieldset ul:after
{
    clear: both;
}

#page form fieldset ul li
{
    float: left;
    -webkit-box-sizing: content-box;
       -moz-box-sizing: content-box;
            box-sizing: content-box;
    width: 3em;
    height: 5em;
    margin: 0 1em 1em;
    cursor: pointer;
    border-bottom: #fff 3px solid;
}

#page form fieldset ul li.current
{
    border-bottom: #e60000 3px solid;
}

#page form fieldset ul li img
{
    width: 100%;
}

#overlay
{
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 100%;
    -webkit-transition: opacity .3s ease;
       -moz-transition: opacity .3s ease;
        -ms-transition: opacity .3s ease;
         -o-transition: opacity .3s ease;
            transition: opacity .3s ease;
    -webkit-transform: translate(-100%, 0);
       -moz-transform: translate(-100%, 0);
        -ms-transform: translate(-100%, 0);
         -o-transform: translate(-100%, 0);
            transform: translate(-100%, 0);
    opacity: 0;
    background-color: rgba(0,0,0,.4);
    background-image: url('/store/techo/2018/images/loading3.gif');
    background-repeat: no-repeat;
    background-position: 50% 50%;
    -webkit-background-size: 3.2em 3.2em;
       -moz-background-size: 3.2em 3.2em;
            background-size: 3.2em 3.2em;
}

#overlay.active
{
    -webkit-transition: opacity .3s ease .3s;
       -moz-transition: opacity .3s ease .3s;
        -ms-transition: opacity .3s ease .3s;
         -o-transition: opacity .3s ease .3s;
            transition: opacity .3s ease .3s;
    -webkit-transform: translate(0, 0);
       -moz-transform: translate(0, 0);
        -ms-transform: translate(0, 0);
         -o-transform: translate(0, 0);
            transform: translate(0, 0);
    opacity: 1;
}

body.iframe
{
    height: auto;
}

body.iframe a.mdi-window-close
{
    position: absolute;
    right: 4em;
    bottom: 3em;
    display: block;
    color: #509be5;
}

body.iframe a.mdi-window-close:before
{
    font-size: 24px;
}

body.iframe a.mdi-window-close span
{
    font-size: 16px;
    font-weight: bold;
    line-height: 1.5;
    display: inline-block;
    vertical-align: middle;
}

body.iframe > header,
body.iframe > footer
{
    display: none;
}

body.iframe #page
{
    width: 80em;
    min-height: 0;
    padding: 0 4em 7.7em;
}

body.iframe #page section header h2
{
    margin-bottom: 2em;
    padding: 3.4em 0 1.2em;
}

body.iframe #page section header h2 span
{
    font-size: 24px;
}

body.iframe #page section > dl dt
{
    font-size: 20px;
}

body.iframe #page form:before,
body.iframe #page form:after
{
    display: table;
    content: '';
}

body.iframe #page form:after
{
    clear: both;
}

body.iframe #page form fieldset:first-child
{
    float: left;
    width: 34em;
}

body.iframe #page form fieldset:first-child ~ fieldset
{
    float: right;
    width: 34em;
}

body.iframe #page form > a
{
    width: 28em;
}

body.iframe #page form p
{
    clear: both;
}

body.iframe #page form p br
{
    display: inherit;
}

body.iframe #page form ul li
{
    margin: 0 .4em 0 0;
}

body.iframe #overlay
{
    background-color: rgba(255,255,255,.8);
    -webkit-background-size: 32px 32px;
       -moz-background-size: 32px 32px;
            background-size: 32px 32px;
}

.ua-desktop body
{
    width: 640px;
    min-height: 100%;
    margin: 0 auto;
}

.ua-desktop body.iframe
{
    width: auto;
}

.ua-desktop body.iframe a
{
    -webkit-transition: opacity .3s;
       -moz-transition: opacity .3s;
        -ms-transition: opacity .3s;
         -o-transition: opacity .3s;
            transition: opacity .3s;
}

.ua-desktop body.iframe a:hover
{
    opacity: .4;
}

/*# sourceMappingURL=dev/store/techo/ja/2018/comment/styl/comment.css.map */