@charset "utf-8";
* {
    margin: 0;
    padding: 0;
}
.clearfix:after {
    content: ".";
    display: block;
    clear: both;
    height: 0;
    visibility: hidden;
}
.clearfix {
    min-height: 1px;
}
* html .clearfix {
    height: 1px;
    /*\*//*/
  height: auto;
  overflow: hidden;
  /**/
}
html {
    font-family: -apple-system, BlinkMacSystemFont, "BIZ UDPGothic", "ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN, "メイリオ", Meiryo, "Noto Sans CJK JP", "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}
.fl {
    float: left;
}
.flimg img {
    float: left;
}
.fldiv {
    width: 960px;
}
.fldiv div {
    float: left;
}
.rblock {
    position: relative;
}
.ablock {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
}
.rblock img, .ablock img {
    display: block;
}
.pblock img {
    display: block;
    width: 100%;
    height:auto;
}
.tx {
    width: 100%;
    position: absolute;
}
li {
    list-style: none;
}
img {
    border: 0;
    vertical-align: top;
}
a {
    color: #00aec6;
    outline: 0;
    word-wrap:break-word;
}
a:focus {
    outline: 0;
}
html {
    width: 100%;
    background: #f2f2f2;
    overflow-y: scroll;
}
body {
    width: 100%;
	min-width: 960px;
}
#wrapper {
    width: 100%;
    position: relative;
    line-height: 1.5;
    background-color: #f37412;
    overflow-x: hidden;
}
.wrapper {
    width: 100%;
}
.contents {
    position: relative;
    width: 1024px;
    margin: 0 auto;
}
/* common */
#bg {
    position: relative;
    width: 100%;
    background: url("../images/cp03/bg.png")no-repeat;
    background-position: top center;
}
#lovl {
    position: fixed;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    z-index: 10000;
    background-color: #f37412;
}
#loadimg {
    position: absolute;
    width: 300px;
    height: 73px;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    margin: auto;
    -webkit-animation: a_load_img 1s linear 0s infinite;
    animation: a_load_img 1s linear 0s infinite;
}
.over img {
    transition: .2s;
}
.over img:hover {
    opacity: .7;
}
.no_newline {
    white-space: nowrap;
}
.hidn {
    overflow: hidden;
}
.indent {
    padding-left: 1em;
    text-indent: -1em;
    display: inline-block;
}
.f_box {
    display:-webkit-box;
    display: flex;
}
@-webkit-keyframes a_load_img {
    0% {
        opacity: 1;
    }
    50% {
        opacity: .5;
    }
    100% {
        opacity: 1;
    }
}
@keyframes a_load_img {
    0% {
        opacity: 1;
    }
    50% {
        opacity: .5;
    }
    100% {
        opacity: 1;
    }
}
.ptop {
    position: fixed;
    right: 1em;
    bottom: 7em;
    text-align: right;
    display: block;
    z-index: 100 !important;
}
.ptop img {
    width: 7.813rem !important;
}
.ptop a:hover {
    opacity: 0.7;
}
h1 {
    width: 78.02734375%;
    margin-left: 11.5234375%;
    padding-top: 6.25%;
    margin-bottom: 8.203125%;
}
#rule_bg {
    width: 93.359375%;
    margin: 0 auto;
    background: url("../images/cp03/rule_bgmain.png")repeat-y;
    background-size: 100% auto;
    position: relative;
}
#rule_bg::before {
    content: "";
    width: 100%;
    background: url("../images/cp03/rule_bgtop.png")no-repeat;
    background-size: 100% auto;
    background-position: left bottom;
    height: 22px;
    position: absolute;
    top: -22px;
    pointer-event: none;
}
#rule_bg::after {
    content: "";
    width: 100%;
    background: url("../images/cp03/rule_bgbtm.png")no-repeat;
    background-size: 100% auto;
    background-position: left top;
    height: 22px;
    position: absolute;
    bottom: -22px;
    pointer-event: none;
}
#rule {
    width: 94.351464435%;
    margin: 0 auto;
    font-size: 18px;
}
#rule h2 {
    width: 96.230598669%;
    padding-top: 2.106430155%;
    margin: 0 auto 4.4345898%;
    position: relative;
}
#rule h2 a {
    position: absolute;
    width: 31.451612903%;
    left: 42.165898617%;
    top: 28.846153846%;
}
#rule h3 {
    background: #2c3033;
    border-bottom: #00aec6 solid 5px;
    color: #fff;
    font-size: 25px;
    padding: 12px 0 12px 16px;
    line-height: 1;
    margin-bottom: 2.993348115%;
}
#rule div {
    margin-bottom: 5.32150776%;
}
#rule div:last-child {
    margin-bottom: 0;
    padding-bottom: 2.106430155%;
}
#present {
    width: 83.148558758%;
    margin: 4.4345898% auto 0;
}
.indnt {
    margin-left: 5%;
}
#copyright {
    background: #2c3033;
    color: #fff;
}
#copyright p {
    font-size: 14px;
    padding: 2.9296875% 0;
    width: 93.359375%;
    margin: 9.86328125% auto 0;
}

@media screen and (min-width:2001px) {
    #bg {
        background-size: 100% auto;
    }
}
@media screen and (max-width:1024px) {
    .contents {
        width: 100%;
    }
}
@media screen and (max-width:767px) {
    /* common */
    #wrapper {
        overflow-x: hidden;
    }
	body {
		min-width: auto;
	}
    #bg {
        background-size: 195.3125% auto;
    }
    #maincontents{
        padding-top: 35px;
	}
    .ptop img {
        width: 4rem !important;
    }
    .ptop {
        bottom: 1em;
    }
    .pc { display: none; }
    .sp { display: block; }
    .sp_inline { display: inline; }
    #loadimg {
        width: 70%;
        max-width: 300px;
    }
    #loadimg img {
        width: 100%;
    }
    #rule {
        font-size: 11px;
    }
    #rule h3 {
        font-size: 14px;
        padding: 8px 0 8px 10px;
        border-bottom: #00aec6 solid 3px;
    }
    #copyright p {
        font-size: x-small;
    }
}