@charset "UTF-8";


/*  common
------------------------- */

body,html {display: block;}
body {
    font-family: "游ゴシック",YuGothic,"メイリオ",Meiryo,"ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","ＭＳ Ｐゴシック","MS PGothic",sans-serif;
    background: #ffffff;
    font-size: 16px;
    line-height: 1.7;
    letter-spacing: 0.1em;
    color: #000000;
}

body * {box-sizing: border-box;}

.container {padding-left: 2rem;padding-right: 2rem;}
section {padding: 1.5rem 0;}

p {font-size: 1rem;font-weight: bold;margin-bottom: 1em;}

a {color: #000000;transition: all 0.4s;}
a:hover,a:focus {color: #42507b;text-decoration: none;}

img {width: inherit;max-width: 100%;height: auto;}

ul {margin: 0;}
ul li {position: relative;}
ul.circle {display: inline-block;list-style: none;}
ul.circle li {padding-left: 18px;margin-bottom: 2em;text-align: left;}
ul.circle li::before {content: "●";position: absolute;left: 0;}
ul.disc {padding-left: 20px;list-style: disc;}

table {width: 100%;}
th,td {display: block;position: relative;padding: 16px 8px;vertical-align: top;}
th {font-weight: bold;border-bottom: solid 1px #6479bb;}
td {margin-bottom: 8px;}

dl dt {font-size: 18px;margin-bottom: 8px;padding-bottom: 8px;color: #42507b;border-bottom: solid 1px #42507b;}
dl dd {margin-bottom: 48px;}

h2, .h2 {font-size: 1.5rem;line-height: 1.7;}
h3, .h3 {font-size: 30px;font-weight: bold;line-height: 1.7;}
h4, .h4 {font-size: 20px;font-weight: bold;line-height: 1.7;}
h5, .h5 {font-size: 18px;font-weight: bold;line-height: 1.7;}

.more {display: inline-block;}
.more a {display: inline-block;padding: 10px 25px;font-size: 12px;line-height: 1;color: #6479bb;border: solid 1px #6479bb;}
.more a:hover {color: #fff;background: #6479bb;}
.link {color: #6479bb;text-decoration: underline;}
strong {line-height: 1.875em;}
.color-white {color: #fff;}
.color-blue {color: #42507b;}
.xs-hidden {display: none;}
.up-center {align-items: center;-webkit-align-items: center;}
.flex-up-center {display: -ms-flexbox;display: flex;align-items: center;-webkit-align-items: center;}
.flex-wrap {-ms-flex-wrap: wrap;flex-wrap: wrap;}

.font-small {font-size: 14px;}
.font-large {font-size: 18px;}
.font-xlarge {font-size: 20px;}
.font-xxlarge {font-size: 30px;}

.text-left {text-align: left !important;}
.text-center {text-align: center !important;}
.text-right {text-align: right !important;}

.d-none {display: none;}


/* -- header
-------------------- */
header {}
header > .inner {}
header .mainvisual {background-image: url(../images/main_bg_sp.jpg);background-size: cover;background-position: 50% 50%;}
header .mainvisual img {display: block;width: 100%;margin: 0 auto;padding: 2rem 1rem;}


/* -- footer
-------------------- */
footer {
    padding: 2rem 0;
    background: rgb(51,77,160);
    background: -moz-linear-gradient(-45deg,  rgb(51,77,160) 0%, rgb(97,61,148) 15%, rgb(175,46,139) 29%, rgb(230,33,110) 45%, rgb(234,90,61) 60%, rgb(241,141,65) 79%, rgb(252,209,119) 100%);
    background: -webkit-linear-gradient(-45deg,  rgb(51,77,160) 0%,rgb(97,61,148) 15%,rgb(175,46,139) 29%,rgb(230,33,110) 45%,rgb(234,90,61) 60%,rgb(241,141,65) 79%,rgb(252,209,119) 100%);
    background: linear-gradient(135deg,  rgb(51,77,160) 0%,rgb(97,61,148) 15%,rgb(175,46,139) 29%,rgb(230,33,110) 45%,rgb(234,90,61) 60%,rgb(241,141,65) 79%,rgb(252,209,119) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#334da0', endColorstr='#fcd177',GradientType=1 );
}
footer > div > .inner {}
footer h3 {margin-bottom: 1rem;color: #fff;}
footer p {font-weight: normal;color: #fff;}
footer p + p {margin-bottom: 0;}

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

/* slider */
#slider {padding-top: 0;}

/* concept */
#concept {}
#concept h2 {font-size: 1.125rem;font-weight: bold;margin-bottom: 1.5em;text-align: center;}
#concept h2 span {display: inline-block;font-size: 1.25rem;background: #f2ec3f;margin-bottom: 0.25rem;}
.concept-text {}
.concept-text img {display: block;margin: 0 auto 1rem;}
.concept-text > div {}
.concept-text > div h3 {font-size: 1.625rem;margin-bottom: 0.5em;}
.concept-text > div p {font-size: 1rem;font-weight: bold;margin-bottom: 1em;}

/* present */
#present {background-color: #f3ec44;background-image: url(../images/present_bg.png);background-size: 100%;background-repeat: no-repeat;}
#present h2 {font-size: 1.875rem;font-weight: bold;padding-right: 0.5em;display: -webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack: center;-ms-flex-pack: center;justify-content: center;-webkit-box-align: center;-ms-flex-align: center;align-items: center;}
#present h2 img {max-height: 72px;padding-bottom: 1rem;padding-right: 1rem;}
.present-box {margin-bottom: 1rem;}
.present-box > .inner {padding: 1rem;border-radius: 10px;background: #fff;}
.present-box > .inner > div {}
.present-box > .inner > div:nth-child(1) h3 {font-size: 1.5rem;display: -webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;-ms-flex-pack: distribute;justify-content: space-around;margin-bottom: 0.5em;padding-bottom: 0.5em;line-height: 1;border-bottom: solid 1px #000;}
.present-box > .inner > div:nth-child(1) h3 img {width: 32px;}
.present-box > .inner > div:nth-child(1) h3 span {display: inline-block;font-size: 1.125rem;}
.present-box > .inner > div:nth-child(1) h3 strong {font-size: 1.75rem;line-height: 1;padding-right: 0.125em;}
.present-box > .inner > div:nth-child(2) {}
.present-box > .inner > div:nth-child(2) h3 {font-size: 1rem;text-align: center;}
.present-box > .inner > div:nth-child(2) h3 span {display: block;font-size: 1.5rem;}

/* flow */
#flow {padding-top: 2rem;}
#flow .flow-inner {position: relative;margin-bottom: 1rem;padding-bottom: 2.5rem;}
#flow .flow-inner::after {content: "";position: absolute;bottom: 0;left: 0;width: 100%;height: 24px;margin: auto;background-image: url(../images/flow-line.png);background-size: cover;}
#flow .flow-inner .flow-title {position: relative;margin-bottom: 2rem;}
#flow .flow-inner .flow-title h2 {line-height: 1;padding: 0 1rem;}
#flow .flow-inner .flow-title h2::before {content: "";position: absolute;top: 0;bottom: 0;left: 0;width: 100%;height: 24px;margin: auto;background-image: url(../images/flow-line.png);background-size: cover;}
#flow .flow-inner .flow-title h2 img {display: block;position: relative;margin: 0 auto;}
.step-wrap {display: -webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient: vertical;-webkit-box-direction: normal;-ms-flex-direction: column;flex-direction: column;padding: 0 1rem;}
.step-wrap .step-box {position: relative;margin-bottom: 1rem;padding-bottom: 3rem;}
.step-wrap .step-box::after {content: "";position: absolute;bottom: 0;left: 12px;right: 0;margin: auto;width: 25px;height: 31px;background-image: url(../images/flow_arrow.png);background-size: 100%;transform: rotate(90deg);}
.step-wrap .step-box img {display: block;}
.step-wrap .step-box.step-box1 {}
.step-wrap .step-box.step-box2 {margin-bottom: 0;padding-bottom: 0.5rem;}
.step-wrap .step-box.step-box2::after {content: none;}
.step-wrap .step-box.step-box3 {-ms-flex-order: 4;order: 4;}
.step-wrap .step-box.step-box3::after {content: none;}
.step-wrap .step-box.step-btn {-ms-flex-order: 3;order: 3;}
.step-wrap .step-box.step-btn a {}
.step-wrap .step-box.step-btn a img {}
.step-note {}
.step-note img {display: block;width: 104px;margin: 0 auto 1rem;}
.step-note p {font-size: 0.813rem;font-weight: normal;}

/* photo-gallery */
#photo-gallery {position: relative;padding: 3rem 0;background-color: #f3ec44;}
#photo-gallery > div {position: relative;z-index: 1;}
#photo-gallery::before {content: "";position: absolute;top: 0;left: 0;width: 100%;height: 35%;background-image: url(../images/photo-gallery_bg_top.png);background-size: 100%;background-repeat: no-repeat;}
#photo-gallery::after {content: "";position: absolute;bottom: 0;right: 0;width: 60%;height: 22%;background-image: url(../images/photo-gallery_bg_bottom.png);background-size: 100%;background-repeat: no-repeat;}
.gallery-title {margin-bottom: 2rem;}

#sb_instagram .sb_instagram_header {float: none;text-align: center;padding: 0 !important;margin-bottom: 2rem !important;}
#sb_instagram .sb_instagram_header a {float: none;}
#sb_instagram .sbi_header_text {float: none;}
#sb_instagram .sbi_header_text h3 {margin: 0 !important;float: none;font-size: 1.5rem;}
#sb_instagram .sbi_header_img {display: none;}


.gallery-wrap {}
.gallery-wrap > .inner {}
#sb_instagram #sbi_load .sbi_load_btn {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    font-size: 1rem;
    line-height: 1;
    align-items: center;
    margin: 0;
    padding: 0.75rem;
    font-weight: bold;
    border-radius: 10px;
    color: #ffffff;
    background: #ffffff;
    background: rgb(51,77,160);
    background: -moz-linear-gradient(-45deg, rgb(51,77,160) 0%, rgb(97,61,148) 15%, rgb(175,46,139) 29%, rgb(230,33,110) 45%, rgb(234,90,61) 60%, rgb(241,141,65) 79%, rgb(252,209,119) 100%);
    background: -webkit-linear-gradient(-45deg, rgb(51,77,160) 0%,rgb(97,61,148) 15%,rgb(175,46,139) 29%,rgb(230,33,110) 45%,rgb(234,90,61) 60%,rgb(241,141,65) 79%,rgb(252,209,119) 100%);
    background: linear-gradient(135deg, rgb(51,77,160) 0%,rgb(97,61,148) 15%,rgb(175,46,139) 29%,rgb(230,33,110) 45%,rgb(234,90,61) 60%,rgb(241,141,65) 79%,rgb(252,209,119) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#334da0', endColorstr='#fcd177',GradientType=1 );
    text-decoration: none;
}
#sb_instagram #sbi_load .sbi_load_btn i {
    position: relative;
    top: 2px;
    font-size: 1.5rem;
    margin-right: 0.5rem;
}
#sb_instagram #sbi_load .sbi_load_btn img {position: relative;top: 3px;width: 1.25rem;margin-right: 0.5em;}

/* note */
#note {padding: 3rem 0;}
.agreement-wrap {height: 300px;padding: 1rem;border: solid 1px #cccccc;overflow: scroll;}
.agreement-wrap > .inner {}
.agreement-wrap h4 {font-size: 1rem;font-weight: bold;margin-bottom: 0.5rem;}
.agreement-wrap ul {margin-bottom: 1rem;}
.agreement-wrap ul li {position: relative;font-size: 0.813rem;margin-bottom: 0.5em;padding-left: 1.56em;}
.agreement-wrap ul li::before {content: "●";position: absolute;top: 0;left: 0;}



/* result */
#result {position: relative;background: #f3ec43;}
#result > div {position: relative;z-index: 1;}
#result::before {content: "";position: absolute;top: 0;left: 0;width: 100%;height: 35%;background-image: url(https://www.town.oirase.aomori.jp/webphoto/images/photo-gallery_bg_top.png);background-size: 100%;background-repeat: no-repeat;}
#result::after {content: "";position: absolute;bottom: 0;right: 0;width: 60%;height: 22%;background-image: url(https://www.town.oirase.aomori.jp/webphoto/images/photo-gallery_bg_bottom.png);background-size: 100%;background-repeat: no-repeat;}
.result-title {padding: 0 1rem;}
.result-title h2 {text-align: center;}
.result-title h2 img {display: block;max-width: 64px;margin: 0 auto 1rem;}
.result-title h2 img + img {max-width: none;width: 100%;margin-bottom: 2rem;}
.result-title h3 {text-align: center;margin-bottom: 1rem;}
.result-title p {margin-bottom: 2rem;}

.result-wrap {}
.result-box {padding: 1rem;background: #fff;border-radius: 4px;margin-bottom: 2rem;}
.result-box .item-img {}
.result-box .item-img img {}
.result-box .item-text {}
.result-box .item-text .rank {display: -webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack: center;-ms-flex-pack: center;justify-content: center;-webkit-box-align: center;-ms-flex-align: center;align-items: center;margin-bottom: 0.5rem;}
.result-box .item-text .rank img {position: relative;top: -2px;display: block;width: 32px;}
.result-box .item-text .rank span {font-size: 1.375rem;line-height: 1;display: inline-block;padding: 0.5rem 0;padding-left: 0.5rem;}
.result-box .item-text .account {display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-pack: center;-ms-flex-pack: center;justify-content: center;-webkit-box-align: center;-ms-flex-align: center;align-items: center;margin-bottom: 0;}
.result-box .item-text .account img {width: 24px;}
.result-box .item-text .account span {font-weight: bold;display: inline-block;padding-left: 0.5rem;}
.result-wrap.rank1 {}
.result-wrap.rank1 .result-box {}
.result-wrap.rank2 {}
.result-wrap.rank2 .result-box {}
.result-wrap.rank3 {}
.result-wrap.rank3 .result-box {}


@media print,screen and (min-width: 600px) {

    section {padding: 2rem 0;}

    .d-sm-none {display: none;}
    .d-sm-inline-block {display: inline-block;}
    .d-sm-block {display: block;}


    /* -- footer
    -------------------- */
    footer > div > .inner {display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;-webkit-box-pack: center;-ms-flex-pack: center;justify-content: center;}
    footer h3 {margin-bottom: 0;}
    footer .inner > div {padding-left: 2em;}
    footer p {margin-bottom: 0;}


    /* -- main
    -------------------- */
    
    /* concept */
    #concept h2 {font-size: 1.75rem;}
    #concept h2 span {margin-right: 0.5rem;font-size: 2rem;}
    .concept-text {display: -webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;padding: 0 2rem;}
    .concept-text img {width: 120px;height: auto;margin: 0;}
    .concept-text > div {-webkit-box-flex: 1;-webkit-flex: 1;-ms-flex: 1;flex: 1;padding-left: 2rem;}
    .concept-text > div h3 {font-size: 1.5rem;}
    .concept-text > div p {font-size: 0.875rem;}
    .concept-text > div p + p {margin-bottom: 0;}
    
    /* present */
    #present {text-align: center;}
    .present-wrap {display: -webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap: wrap;flex-wrap: wrap;-webkit-box-pack: center;-ms-flex-pack: center;justify-content: center;padding-top: 1rem;}
    .present-box {margin: 0 0.5rem 1rem;}
    .present-box > .inner {width: 300px;margin: 0 auto;}
    .present-box:nth-child(1) {width: 100%;}
    
    /* flow */
    #flow .flow-inner {margin-bottom: 0;padding-bottom: 4rem;}
    #flow .flow-inner .flow-title h2 img {max-width: 496px;}
    .step-wrap {-webkit-box-orient: horizontal;-webkit-box-direction: normal;-ms-flex-direction: row;flex-direction: row;-ms-flex-wrap: wrap;flex-wrap: wrap;padding: 0;margin: 0 -0.5rem 2rem;}
    .step-wrap .step-box {width: 33.333%;padding: 0 0.5rem;}
    .step-wrap .step-box::after {transform: rotate(0);top: 40px;bottom: 0;left: auto;right: -7px;width: 19px;height: 24px;}
    .step-wrap .step-box img {width: 100%;}
    .step-wrap .step-box.step-box2 {margin-bottom: 1rem;}
    .step-wrap .step-box.step-box2::after {content: "";}
    .step-wrap .step-box.step-box3 {-ms-flex-order: 3;order: 3;}
    .step-wrap .step-box.step-btn {-ms-flex-order: 4;order: 4;width: 100%;}
    .step-wrap .step-box.step-btn::after {content: none;}
    .step-note {display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;padding: 0 2rem;}
    .step-note img {margin: 0;}
    .step-note p {font-size: 0.75rem;-webkit-box-flex: 1;-webkit-flex: 1;-ms-flex: 1;flex: 1;padding-left: 2rem;}
    
    /* photo-gallery */
    #photo-gallery::before {height: 44%;}
    .gallery-title {margin-bottom: 3rem;}
    .gallery-title img {display: block;max-width: 400px;margin: 0 auto;}
    #sb_instagram #sbi_load .sbi_load_btn {max-width: 320px;margin: 1rem auto 0;}


/* result */
#result {}
#result > div {}
#result::before {}
#result::after {}
.result-title {}
.result-title h2 {}
.result-title h2 img {}
.result-title h2 img + img {}
.result-title h3 {}
.result-title p {}

.result-wrap {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}
.result-box {}
.result-box .item-img {}
.result-box .item-img img {}
.result-box .item-text {}
.result-box .item-text .rank {}
.result-box .item-text .rank img {
    width: 24px;
}
.result-box .item-text .rank span {
    font-size: 1.125rem;
}
.result-box .item-text .account {}
.result-box .item-text .account img {
    width: 20px;
}
.result-box .item-text .account span {}
.result-wrap.rank1 {}
.result-wrap.rank1 .result-box {
    max-width: 500px;
}
.result-wrap.rank1 .result-box {}
.result-wrap.rank1 .result-box .item-text .rank img {
    width: 40px;
}
.result-wrap.rank1 .result-box .item-text .rank span {
    font-size: 1.5rem;
}
.result-wrap.rank2 {
    margin: 0 -1.5%;
}
.result-wrap.rank2 .result-box {
    width: 30%;
    margin: 0 1.5% 2rem;
    padding: 0.75rem;
}
.result-wrap.rank2 .result-box {}
.result-wrap.rank2 .result-box .item-text .rank img {
    top: 0;
}
.result-wrap.rank2 .result-box .item-text .rank span {}
.result-wrap.rank3 {
    margin: 0 3%;
}
.result-wrap.rank3 .result-box {
    width: 30%;
    margin: 0 1.5% 2rem;
    padding: 0.75rem;
}
.result-wrap.rank3 .result-box {}
.result-wrap.rank3 .result-box .item-text .rank img {
    top: 0;
}
.result-wrap.rank3 .result-box .item-text .rank span {
    font-size: 1rem;
}

}

@media print,screen and (min-width: 992px) {

    .container {}
    section {padding: 5rem 0;}
    p {font-size: 1.125rem;}

    .d-lg-none {display: none;}
    .d-lg-inline-block {display: inline-block;}
    .d-lg-block {display: block;}


    /* -- header
    -------------------- */
    header .mainvisual {background-image: url(../images/main_bg.jpg);}
    header .mainvisual img {padding: 0;padding-top: 2rem;}


    /* -- footer
    -------------------- */
    footer {padding: 5rem 0;}
    footer p {line-height: 1.3;}


    /* -- main
    -------------------- */
    
    /* slider */
    #slider {padding-bottom: 0rem;}
    
    /* concept */
    #concept h2 {font-size: 1.875rem;margin-bottom: 2em;}
    #concept h2 span {font-size: 2.25rem;}
    .concept-text {padding: 0 8.888%;}
    .concept-text img {width: 145px;}
    .concept-text > div {padding-left: 3rem;}
    .concept-text > div h3 {font-size: 1.875rem;}
    .concept-text > div p {font-size: 1.125rem;font-weight: normal;}
    
    /* present */
    #present h2 {font-size: 2.5rem;margin-bottom: 0.5rem;letter-spacing: 0.2em;}
    #present h2 img {max-height: 85px;padding-right: 1.5rem;}
    .present-wrap {display: block;padding: 1rem 8.888% 0;}
    .present-box {width: 100%;margin: 0 0 1.5rem;}
    .present-box > .inner {width: 100%;display: -webkit-box;display: -ms-flexbox;display: flex;-ms-flex-wrap: wrap;flex-wrap: wrap;-webkit-box-align: end;-ms-flex-align: end;align-items: flex-end;padding: 1rem 2rem;}
    .present-box > .inner > div {-webkit-box-flex: 1;-webkit-flex: 1;-ms-flex: 1;flex: 1;padding-right: 2rem;}
    .present-box > .inner > div:nth-child(1) h3 {font-size: 2.25rem;margin-bottom: 0.5rem;padding-bottom: 0;border-bottom: none;-webkit-box-pack: start;-ms-flex-pack: start;justify-content: flex-start;}
    .present-box > .inner > div:nth-child(1) h3 img {width: 48px;margin-right: 1.5rem;}
    .present-box > .inner > div:nth-child(1) h3 span {font-size: 2rem;margin-left: auto;}
    .present-box > .inner > div:nth-child(1) h3 strong {position: relative;top: 2px;font-size: 2.5rem;display: inline-block;}
    .present-box > .inner > div:nth-child(2) {margin-left: auto;padding-right: 0;padding-left: 2rem;border-left: solid 1px #000;}
    .present-box > .inner > div:nth-child(2) h3 {font-size: 1.5rem;text-align: left;line-height: 1.56;}
    .present-box > .inner > div:nth-child(2) h3 span {font-size: 2rem;}
    
    /* flow */
    #flow {padding-top: 5rem;}
    #flow .flow-inner {padding-bottom: 6rem;}
    #flow .flow-inner .flow-title {margin-bottom: 4rem;}
    #flow .flow-inner .flow-title h2::before {height: 31px;}
    #flow .flow-inner .flow-title h2 img {width: 680px;max-width: 680px;}
    .step-wrap {padding: 0 8.888%;margin: 0 -1.5rem 2rem;}
    .step-wrap .step-box {margin-bottom: 2rem;padding: 0 1.5rem;}
    .step-wrap .step-box::after {top: 56px;right: -14px;width: 24px;height: 30px;}
    .step-note {padding: 0 8.888%;}
    .step-note img {width: 136px;}
    
    /* photo-gallery */
    #photo-gallery {padding: 5rem 0;}
    .gallery-title img {max-width: 600px;}
    #sb_instagram .sbi_header_text h3 {font-size: 2rem;}
    #sb_instagram #sbi_load .sbi_load_btn {font-size: 1.25rem;max-width: 600px;margin-top: 2rem;padding: 1rem;}
    #sb_instagram #sbi_load .sbi_load_btn img {width: 1.5rem;}
    
    /* note */
    .agreement-wrap {padding: 2rem;}


/* result */
#result {}
#result > div {}
#result::before {}
#result::after {}
.result-title {}
.result-title h2 {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin-bottom: 3rem;
}
.result-title h2 img {
    width: 128px;
    max-width: 128px;
    margin: 0;
}
.result-title h2 img + img {
    width: 720px;
    margin: 0;
    margin-left: 2rem;
}
.result-title h3 {
    font-size: 2.5rem;
}
.result-title p {
    text-align: center;
    margin-bottom: 5rem;
}

.result-wrap {}
.result-box {}
.result-box .item-img {
    margin-bottom: 1rem;
}
.result-box .item-img img {}
.result-box .item-text {}
.result-box .item-text .rank {}
.result-box .item-text .rank img {}
.result-box .item-text .rank span {}
.result-box .item-text .account {}
.result-box .item-text .account img {}
.result-box .item-text .account span {}

.result-wrap.rank1 {
    margin-bottom: 2rem;
}
.result-wrap.rank1 .result-box {
    position: relative;
    max-width: 640px;
    padding: 1.5rem;
}
.result-wrap.rank1 .result-box::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: -156px;
    width: 200px;
    height: 268px;
    background-image: url(../images/result_character.png);
    background-size: 100%;
}
.result-wrap.rank1 .result-box .item-text .rank img {
}
.result-wrap.rank1 .result-box .item-text .rank span {font-size: 2rem;}
.result-wrap.rank2 {
}
.result-wrap.rank2 .result-box {padding-bottom: 1rem;}
.result-wrap.rank2 .result-box .item-img {margin-bottom: 0;}
.result-wrap.rank2 .result-box .item-text .rank img {width: 32px;}
.result-wrap.rank2 .result-box .item-text .rank span {
    font-size: 1.5rem;
}
.result-wrap.rank3 {
}
.result-wrap.rank3 .result-box {padding-bottom: 1rem;}
.result-wrap.rank3 .result-box .item-img {margin-bottom: 0;}
.result-wrap.rank3 .result-box .item-text .rank img {width: 24px;}
.result-wrap.rank3 .result-box .item-text .rank span {font-size: 1.125rem;}


}

@media print,screen and (min-width: 1200px) {

    .container {width: 1080px;margin-left: auto;margin-right: auto;padding: 0;}

    header {}
    header > .inner {}
    header .mainvisual {}
    header .mainvisual img {max-width: 1200px;}

}


@media print,screen and (min-width: 320px) {

    .container {
        padding-left: 1rem;
        padding-right: 1rem;
    }

}