@charset 'euc-jp';

/* Layout
 *********************************** */

.container div,
.container p,
.container h1,
.container h2,
.container h3,
.container h4,
.container h5,
.container h6,
.container ol,
.container ul,
.container li,
.container dl,
.container dt,
.container dd {
    box-sizing: border-box;
}

html {
    font-size: 62.5%;
}

.bg-\#000 {
    background-image: none;
    background-color: #000;
}

.container {
    margin: 0 auto;
    width: 980px;
    line-height: 1.63;
    font-size: 2.2rem;
    line-break: strict;
    overflow-wrap: break-word;
    -webkit-text-size-adjust: 100%;
    color: #fff;

    /* Don't define Meiryo.
    font-family: '¥Ò¥é¥®¥Î³Ñ¥´ Pro W3', 'Hiragino Kaku Gothic Pro', '¥á¥¤¥ê¥ª', Meiryo, '£Í£Ó £Ð¥´¥·¥Ã¥¯', 'MS PGothic', Helvetica, sans-serif;
    */
}

@media screen and (min-width:981px) {
    .container {
        width: 100%;
    }
}

.content-wrapper {
    overflow: hidden;
    margin: 2px auto 0;
    width: 100%;
    background-color: #000;
}

.page-header {
    position: relative;
    margin: 0 auto;
    width: 980px;
    font-family: '¥Ò¥é¥®¥Î³Ñ¥´ Pro W3', 'Hiragino Kaku Gothic Pro', '¥á¥¤¥ê¥ª', Meiryo, '£Í£Ó £Ð¥´¥·¥Ã¥¯', 'MS PGothic', Helvetica, sans-serif;
}

.breadcrumb {
    position: absolute;
    z-index: 99999;
    /*
    top: 76px;
    */
    left: 0;
    margin: 0 auto;
    padding: .6rem 0;
    width: 940px;
    line-height: 1.5;
    font-size: 1.6rem;
    color: #fff;
}

.breadcrumb a:link,
.breadcrumb a:visited,
.breadcrumb a:hover,
.breadcrumb a:active {
    color: #fff;
}

.content {
    margin: 0 auto;
    max-width: 2000px;
    background: url('https://www.maru-jan.com/image/event/2018/daily_challenge/bg_main.jpg') top center no-repeat;
}

.page-footer {
    width: 100%;
    background-color: #fff;
}

.local-navigation {
    position: relative;
    width: 100%;
    height: 141px;
}

.local-navigation .list {
    position: absolute;
    top: 0px;
    left: -6px;
    width: 992px;
}

/* Sections
 *********************************** */

.h1 {
    position: relative;
    width: 980px;
    height: 237px;
}

.title-01 {
    position: absolute;
    top: 0px;
    left: -4px;
    width: 988px;
    height: 237px;
}

.section {
    margin: 0 auto;
    width: 980px;
}

.frame-01 {
    width: 980px;
    background: url('https://www.maru-jan.com/image/event/2018/daily_challenge/bg_01.png') repeat-y top center;
}

.frame-01:after {
    content: url('https://www.maru-jan.com/image/event/2018/daily_challenge/bg_01_footer.jpg');
}

.frame-01 .h2 {
    position: relative;
}

.frame-01 .h2 .image {
    position: absolute;
    top: -120px;
    left: 0px;
}

.notes-01 {
    margin-right: auto;
    margin-left: auto;
    width: 740px;
}

.notes-02 {
    margin-right: auto;
    margin-left: auto;
    width: 890px;
    background: url('https://www.maru-jan.com/image/event/2018/daily_challenge/notes_bg_02.png') repeat-y top center;
}

.notes-02:before {
    content: url('https://www.maru-jan.com/image/event/2018/daily_challenge/notes_bg_01.png');
    position: relative;
    top: -20px;
}

.notes-02:after {
    content: url('https://www.maru-jan.com/image/event/2018/daily_challenge/notes_bg_03.png');
    position: relative;
    top: 20px;
}

.block-01 {
    margin-right: auto;
    margin-left: auto;
    width: 890px;
    background: url('https://www.maru-jan.com/image/event/2018/daily_challenge/calc_bg_02.png') repeat-y top center;
}

.block-01:before {
    content: url('https://www.maru-jan.com/image/event/2018/daily_challenge/calc_bg_01.png');
    position: relative;
    top: -20px;
}

.block-01:after {
    content: url('https://www.maru-jan.com/image/event/2018/daily_challenge/calc_bg_03.png');
    position: relative;
    top: 20px;
}

.block-max {
    margin-right: auto;
    margin-left: auto;
    width: 879px;
    background: url('https://www.maru-jan.com/image/event/2018/daily_challenge/max_bg_02.png') repeat-y top center;
}

.box-max-01 {
    margin: 0 auto;
    width: 651px;
    background: url('https://www.maru-jan.com/image/event/2018/daily_challenge/max_bg_box_01.png') no-repeat top center;
}

.box-max-01:after {
    content: url('https://www.maru-jan.com/image/event/2018/daily_challenge/max_hr.png');
}

.box-max-02 {
    width: 388px;
    background: url('https://www.maru-jan.com/image/event/2018/daily_challenge/max_bg_box_02.png') no-repeat top center;
}

.box-max-score {
    margin: 14px auto 0;
    width: 384px;
    height: 82px;
    line-height: 78px;
    font-size: 6.4rem;
    font-weight: bold;
    text-align: center;
}

.box-max-02-wrapper {
    background: url('https://www.maru-jan.com/image/event/2018/daily_challenge/max_bg_03.png') no-repeat bottom center;
    margin: 0 auto;
    width: 879px;
    padding-bottom: 64px;
}

.notes-02-title {
    background: url('https://www.maru-jan.com/image/event/2018/daily_challenge/notes_title.png') no-repeat top center;
}

/* Atomic CSS
 *********************************** */

.c-\#ffb900 { color: #ffb900; }
.ff-monospace { font-family: 'Courier New', Courier, Monaco, monospace; }
.ff-sans-serif { font-family: '¥Ò¥é¥®¥Î³Ñ¥´ Pro W3', 'Hiragino Kaku Gothic Pro', '¥á¥¤¥ê¥ª', Meiryo, '£Í£Ó £Ð¥´¥·¥Ã¥¯', 'MS PGothic', Helvetica, sans-serif; }
.fl-l { float: left; }
.fl-r { float: right; }
.fw-b { font-weight: bold; }
.fz-lg { font-size: 2.8rem; line-height: 1.28; }
.fz-sm { line-height: 1.8; font-size: 2rem; }
.fz-xs { line-height: 1.33; font-size: 1.8rem; }
.list-d { list-style-type: disc; }
.list-n { list-style-type: none; }
.mb-2\.4rem { margin-bottom: 2.4rem; }
.mb-4\.8rem { margin-bottom: 4.8rem; }
.mb-7\.2rem { margin-bottom: 7.2rem; }
.ml-1\.8rem { margin-left: 1.8rem; }
.ml-4\.2rem { margin-left: 4.2rem; }
.ml-a { margin-left: auto; }
.mr-a { margin-right: auto; }
.mt--\.8rem { margin-top: -.8rem; }
.mt--1\.6rem { margin-top: -1.6rem; }
.mt-1\.2rem { margin-top: 1.2rem; }
.mt-12rem { margin-top: 12rem; }
.mt-16\.8rem { margin-top: 16.8rem; }
.mt-2\.4rem { margin-top: 2.4rem; }
.mt-3\.2rem { margin-top: 3.2rem; }
.mt-4\.8rem { margin-top: 4.8rem; }
.mt-7\.2rem { margin-top: 7.2rem; }
.mt-9\.6rem { margin-top: 9.6rem; }
.ov-h { overflow: hidden; }
.pl-1em { padding-left: 1em; }
.pt-6rem { padding-top: 6rem; }
.ta-c { text-align: center; }
.ti--1em { text-indent: -1em; }
.va-m { vertical-align: middle; }
.w-700px { width: 700px; }
.w-740px { width: 740px; }
.w-800px { width: 800px; }
.w-820px { width: 820px; }