/* ================================================================= */
/* ======================== 0 〜 824px以上 =========================== */
/* ============================================================== */

@media screen and (max-width:824px) {

.wrapper {
text-align: center;
overflow: hidden;
}

/*===== mainvisual =====*/
.mainvisual {
min-width: 100%;
margin: 0 auto;
}
.mainvisual h1 {
width: 251px;
margin: 110px auto 137px;
position: relative;
z-index: 2;
}
.mainvisual h1 img {
width: 100%;
height: auto;
}
.mainvisual p {
font-size: 18px;
line-height: 1.666;
}

/*===== itemdetail =====*/
.introduction {
position: relative;
min-width: 100%;
margin: -44px auto 0;
padding-top: 243px;
overflow: hidden;
}
.introduction::before {
content: "";
display: block;
width: 100%;
height: 533px;
position: absolute;
top: 0;
background-image: url(../images/blanc/bg-01.png);
background-position: left center;
background-size: cover;
z-index: -1;
}
.introduction h2 {
width: 281px;
margin: 0 auto;
color: #009b32;
margin-bottom: 200px;
}
.introduction h2 img {
width: 100%;
height: auto;
}
.introduction p {
font-size: 18px;
line-height: 1.666;
margin-bottom: 153px;
}
.positionrelative {
position: relative;
width: 100%;
margin: 0 auto;
}
.positionrelative::before {
content: "";
display: block;
width: calc(100% + 218px);
/* height: 545px; */
padding-top: 145.333%;
position: absolute;
top: -156px;
left: -121px;
background-image: url(../images/blanc/bg-03.png);
background-size: cover;
background-position: center center;
z-index: -1;
}
.positionrelative h3 {
width: 287px;
margin: 0 auto 65px;
}
.positionrelative p {
width: 84%;
margin: 60px auto 48px;
font-size: 12px;
line-height: 2;
text-align: left;
}
.detailarea {
position: relative;
width: 100%;
}
.detailarea::after {
content: "";
display: block;
width: 403px;
height: 398px;
position: absolute;
bottom: 17px;
right: -5px;
background-image: url(../images/blanc/bg-02.png);
background-size: cover;
background-position: center center;
z-index: -1;
}
.detailarea h4 {
width: 138px;
margin: 0 auto 61px;
}
.detailarea .block01 {
width: 100%;
margin: 0 auto 34px;
text-align: left;
}
.detailarea .block01 img {
width: 100%;
margin-bottom: 25px;
}
.detailarea .block01 dl {
width: 84%;
margin: 0 auto;
}
.detailarea .block01 dl dt {
font-size: 12px;
margin-bottom: 25px;
}
.detailarea .block01 dl dd {
font-size: 9px;
line-height: 2;
}
.detailarea .block01 .btn a {
display: block;
margin: 20px auto 0;
width: 66px;
height: 26px;
line-height: 26px;
text-align: center;
font-size: 8px;
color: #000000;
background-color: #ffffff;
}
.detailarea .block02 {
width: 100%;
margin: 0 auto 53px;
text-align: right;
}
.detailarea .block02 img {
width: 100%;
margin-bottom: 25px;
}
.detailarea .block02 dl {
width: 84%;
margin: 0 auto;
}
.detailarea .block02 dl dt {
font-size: 12px;
margin-bottom: 25px;
}
.detailarea .block02 dl dd {
font-size: 9px;
line-height: 2;
}
.detailarea .block02 .btn a {
display: block;
margin: 20px auto 0;
width: 66px;
height: 26px;
line-height: 26px;
text-align: center;
font-size: 8px;
color: #000000;
background-color: #ffffff;
}
.colorsarea {
position: relative;
}
.colorsarea::after {
content: "";
display: block;
width: 488px;
height: 533px;
position: absolute;
bottom: 0;
right: -104px;
background-image: url(../images/blanc/bg-04.png);
background-size: cover;
background-position: center center;
z-index: -1;
}
.colorsarea h4 {
width: 127px;
margin: 0 auto 62px;
}
.colorsarea .block01 {
width: 100%;
margin: 0 auto 25px;
text-align: left;
}
.colorsarea .block01 img {
width: 100%;
margin-bottom: 25px;
}
.colorsarea .block01 dl {
width: 84%;
margin: 0 auto;
}
.colorsarea .block01 dl dt {
font-size: 12px;
margin-bottom: 25px;
}
.colorsarea .block01 dl dd {
font-size: 9px;
line-height: 2;
}
.colorsarea .block02 {
width: 100%;
margin: 0 auto 53px;
text-align: right;
}
.colorsarea .block02 img {
width: 100%;
margin-bottom: 25px;
}
.colorsarea .block02 dl {
width: 84%;
margin: 0 auto;
}
.colorsarea .block02 dl dt {
font-size: 12px;
margin-bottom: 25px;
}
.colorsarea .block02 dl dd {
font-size: 9px;
line-height: 2;
}
.buyerarea {
margin-top: 68px;
}
.introduction .img {
width: 46.3%;
margin: 0 auto 30px;
}
.introduction .buyer {
text-align: left;
font-size: 9px;
line-height: 1.666;
margin-left: 26%;
}
.introduction .buyer dt {
margin-bottom: 20px;
}
.introduction .buyer dt span {
display: block;
margin-bottom: 16px;
font-size: 7px;
}
.introduction .buyer dd {
font-size: 7px;
line-height: 2;
}

/*===== beforecordinate =====*/
.beforecordinate {
min-width: 100%;
margin: 15px auto 0;
position: relative;
overflow: hidden;
}
.beforecordinate .inner {
width: 100%;
text-align: left;
margin: 0 auto;
position: relative;
}
.beforecordinate::after {
content: "";
display: block;
width: calc(100% + 157px);
/* height: 488px; */
padding-top: 130.133%;
position: absolute;
top: 0;
left: -102px;
background-image: url(../images/blanc/bg-03.png);
background-size: cover;
background-repeat: no-repeat;
background-position: center center;
z-index: -1;
}
.beforecordinate h2 {
width: 293px;
height: auto;
margin: 126px auto 127px;
}
.blancmodel {
width: 49.467%;
margin: 148px auto 130px;
}
.blancmodel img {
margin: 0 auto 103px;
}
.blancmodel dl {
text-align: left;
font-size: 9px;
line-height: 1.666;
width: 82.21%;
margin: 0 auto;
}
.blancmodel dl dt {
margin-bottom: 20px;
}
.blancmodel dl dd {
font-size: 7px;
line-height: 2;
}
.beforecordinate .blancmodel dl dd span {
display: block;
margin-top: 20px;
}
.beforecordinate .blancmodel dl dd span a {
color: #000000;
text-decoration: underline;
}


/*===== coordinate =====*/
.coordinate {
position: relative;
}
.coordinate .inner {
text-align: left;
position: relative;
min-width: 100%;
margin: 0 auto;
}

/*===== style01 =====*/
.style01 {
position: relative;
padding-bottom: 77px;
}
.style01 .subinner {
position: relative;
width: 100%;
height: 100%;
margin: 0 auto;
}
.style01 p.txt01 {
width: 85.866%;
margin: 0 auto 42px;
font-size: 9px;
line-height: 2.667;
letter-spacing: -0.1em;
}
.style01 p.leadtxt {
font-size: 13px;
line-height: 2;
text-align: center;
padding-top: 76px;
margin-bottom: 75px;
position: relative;
z-index: -1;
}
.style01 p.leadtxt::before {
content: "";
display: block;
width: calc(100% + 67px);
height: 405px;
position: absolute;
top: -82px;
left: -42px;
background-image: url(../images/blanc/bg-03.png);
background-size: contain;
background-repeat: no-repeat;
background-position: center center;
z-index: -1;
}
.style01 .img02 {
margin-bottom: 47px;
}
.style01 p.txt02 {
width: 85.866%;
margin: 58px auto 50px;
font-size: 9px;
line-height: 2.667;
letter-spacing: -0.1em;
}
.style01 p.txt03 {
width: 85.866%;
margin: 53px auto 58px;
font-size: 9px;
line-height: 2.667;
letter-spacing: -0.1em;
}
.style01 p.lastlead {
font-size: 13px;
line-height: 2;
text-align: center;
padding-top: 85px;
position: relative;
}
.style01 .subinner .txt02::after {
content: "";
display: block;
width: 403px;
height: 398px;
position: absolute;
bottom: -166px;
left: -112px;
background-image: url(../images/blanc/bg-02.png);
background-size: cover;
background-position: center center;
z-index: -1;
}
.style01::after {
content: "";
display: block;
width: 192%;
/* height: 400px; */
padding-top: 106.67%;
position: absolute;
bottom: 202px;
right: 0;
background-image: url(../images/blanc/bg-01.png);
background-size: cover;
background-position: center center;
z-index: -1;
}
.style01 p.lastlead::after {
content: "";
display: block;
width: 403px;
height: 398px;
position: absolute;
bottom: -194px;
right: -41px;
background-image: url(../images/blanc/bg-02.png);
background-size: cover;
background-position: center center;
z-index: -1;
}

/*===== style02 =====*/
.style02 {
position: relative;
}
.style02 .subinner {
position: relative;
width: 100%;
height: 100%;
margin: 0 auto;
}
.txtarea {
position: relative;
}
.txtarea:after {
content: "";
display: block;
width: 192%;
/* height: 400px; */
padding-top: 106.67%;
position: absolute;
top: 0;
right: -24px;
background-image: url(../images/blanc/bg-01.png);
background-size: cover;
background-position: center center;
z-index: -1;
}
.style02 p.txt01 {
width: 85.866%;
margin: 49px auto 12px;
padding: 0;
font-size: 9px;
line-height: 2.667;
letter-spacing: -0.1em;
position: relative;
}
.style02 p.txt02 {
width: 85.866%;
margin: 12px auto 50px;
font-size: 9px;
line-height: 2.667;
letter-spacing: -0.1em;
}


/*===== buyarea =====*/
.buyarea {
position: relative;
margin-top: 160px;
margin-bottom: 123px;
}
.buyarea .subinner {
width: 100%;
margin: 0 auto;
}
.buyarea .article {
margin-bottom: 142px;
}
.buyarea .article figure {
width: 100%;
position: relative;
}
.buyarea .article figcaption {
text-align: left;
}
.buyarea .article figcaption h3 {
font-size: 13px;
line-height: 2;
}
.buyarea .article figcaption .detail {
width: 70%;
margin: 38px auto 0;
}
.buyarea .article figcaption ul {
margin-top: 38px;
}
.buyarea .article figcaption ul li {
font-size: 9px;
line-height: 3;
letter-spacing: -0.025em;
}
.buyarea .article figcaption ul li a {
color: #a07f50;
text-decoration: underline;
}
.buyarea .style1 h2 {
width: 105px;
margin: 0 auto 88px;
}
.buyarea .style2 h2 {
width: 113px;
margin: 0 auto 94px;
}
.buyarea .style3 h2 {
width: 113px;
margin: 0 auto 88px;
}

/* ================================================= */
/* ===================== SP END. ===================== */
/* =============================================== */

}

/* ================================================================= */
/* ======================== 825px以上 ============================= */
/* ============================================================== */

@media screen and (min-width:825px) and (max-width:1440px) {

.wrapper {
min-width: 1000px;
text-align: center;
overflow: hidden;
}

/*===== mainvisual =====*/
.mainvisual {
min-width: 1000px;
margin: 0 auto;
}
.mainvisual p {
font-size: 27px;
line-height: 1.667;
margin-top: 107px;
margin-bottom: 20px;
letter-spacing: 0.01em;
}

/*===== itemdetail =====*/
.introduction {
position: relative;
min-width: 1000px;
margin: 0 auto;
padding-top: 342px;
overflow: hidden;
}
.introduction::before {
content: "";
display: block;
width: 100%;
height: 799px;
position: absolute;
top: 0;
background-image: url(../images/blanc/bg-01.png);
background-position: center center;
background-size: cover;
background-repeat: no-repeat;
z-index: -1;
}
.introduction h2 {
width: 563px;
margin: 0 auto;
color: #009b32;
margin-bottom: 308px;
}
.introduction h2 img {
width: 100%;
height: auto;
}
.introduction p {
font-size: 27px;
line-height: 2;
letter-spacing: 0.01em;
}
.positionrelative {
position: relative;
width: 1000px;
margin: 0 auto;
padding-top: 267px;
}
.positionrelative::before {
content: "";
display: block;
width: 1187px;
height: 1090px;
position: absolute;
top: -84px;
left: -116px;
background-image: url(../images/blanc/bg-03.png);
background-size: cover;
background-position: center center;
z-index: -1;
}
.positionrelative h3 {
width: 563px;
margin: 0 auto 73px;
}
.positionrelative .img01 {
width: 762px;
margin: 0 auto;
}
.positionrelative p {
width: 762px;
margin: 76px auto 111px;
font-size: 18px;
text-align: justify;
text-justify: inter-ideograph;
line-height: 2;
}

.detailarea {
position: relative;
}
.detailarea::after {
content: "";
display: block;
width: 807px;
height: 796px;
position: absolute;
top: 850px;
right: 0;
background-image: url(../images/blanc/bg-02.png);
background-size: cover;
background-position: center center;
z-index: -1;
}
.detailarea h4 {
width: 276px;
margin: 0 auto 100px;
}
.detailarea .block01 {
width: 762px;
margin: 0 auto 138px;
text-align: left;
}
.detailarea .block01 img {
width: 541px;
margin-bottom: 50px;
}
.detailarea .block01 dl dt {
font-size: 24px;
margin-bottom: 50px;
}
.detailarea .block01 dl dd {
font-size: 18px;
line-height: 2;
}
.detailarea .block01 .btn a {
display: inline-block;
margin-top: 40px;
width: 132px;
height: 51px;
line-height: 51px;
text-align: center;
font-size: 15px;
color: #000000;
background-color: #ffffff;
}
.detailarea .block02 {
width: 762px;
margin: 0 auto 110px;
text-align: right;
}
.detailarea .block02 img {
width: 541px;
margin-bottom: 50px;
}
.detailarea .block02 dl dt {
font-size: 24px;
margin-bottom: 50px;
}
.detailarea .block02 dl dd {
font-size: 18px;
line-height: 2;
}
.detailarea .block02 .btn a {
display: inline-block;
margin-top: 40px;
width: 132px;
height: 51px;
line-height: 51px;
text-align: center;
font-size: 15px;
color: #000000;
background-color: #ffffff;
}

.colorsarea {
position: relative;
}
.colorsarea::after {
content: "";
display: block;
width: 977px;
height: 1065px;
position: absolute;
top: 620px;
right: -200px;
background-image: url(../images/blanc/bg-04.png);
background-size: cover;
background-position: center center;
z-index: -1;
}
.colorsarea h4 {
width: 276px;
margin: 0 auto 100px;
}
.colorsarea .block01 {
width: 762px;
margin: 0 auto 80px;
text-align: left;
}
.colorsarea .block01 img {
width: 541px;
margin-bottom: 50px;
}
.colorsarea .block01 dl dt {
font-size: 24px;
margin-bottom: 50px;
}
.colorsarea .block01 dl dd {
font-size: 18px;
line-height: 2;
}
.colorsarea .block02 {
width: 762px;
margin: 0 auto 118px;
text-align: right;
}
.colorsarea .block02 img {
width: 541px;
margin-bottom: 50px;
}
.colorsarea .block02 dl dt {
font-size: 24px;
margin-bottom: 50px;
}
.colorsarea .block02 dl dd {
font-size: 18px;
line-height: 2;
}
.introduction .buyerarea {
width: 596px;
margin: 0 auto 85px;
padding-left: 111px;
position: relative;
}
.introduction .buyerarea .img {
width: 261px;
margin-right: 31px;
float: left;
}
.introduction .buyer {
width: 303px;
text-align: left;
font-size: 12px;
line-height: 1.666;
position: absolute;
right: 0;
bottom: 0;
}
.introduction .buyer dt {
font-size: 18px;
margin-bottom: 20px;
line-height: 1.25;
}
.introduction .buyer dt span {
display: block;
margin: 0 0 25px 0;
font-size: 13px;
}
.introduction .buyer dd {
width: 500px;
font-size: 12px;
line-height: 2;
}

/*===== beforecordinate =====*/
.beforecordinate {
min-width: 1000px;
margin: 0 auto 263px;
position: relative;
overflow: hidden;
}
.beforecordinate .inner {
text-align: center;
margin: 0 auto;
position: relative;
}
.beforecordinate h2 {
width: 586px;
height: 472px;
margin: 0 auto 384px;
padding-top: 251px;
z-index: 2;
}
.beforecordinate h2::after {
content: "";
display: block;
width: 1065px;
height: 977px;
position: absolute;
top: 0;
left: 50%;
margin-left: -572px;
background-image: url(../images/blanc/bg-03.png);
background-size: cover;
background-position: center center;
z-index: -1;
}
.beforecordinate .img01 {
width: 762px;
margin-bottom: 264px;
}
.beforecordinate .blancmodel {
width: 770px;
margin: 0 auto;
padding-left: 8px;
display: flex;
flex-direction: row-reverse;
}
.beforecordinate .blancmodel img {
width: 460px;
}
.beforecordinate .blancmodel dl {
margin-top: auto;
margin-right: 20px;
text-align: left;
}
.beforecordinate .blancmodel dl dt {
font-size: 18px;
margin-bottom: 25px;
}
.beforecordinate .blancmodel dl dd {
font-size: 14px;
line-height: 1.57;
}
.beforecordinate .blancmodel dl dd span {
display: block;
margin-top: 20px;
}
.beforecordinate .blancmodel dl dd span a {
color: #000000;
text-decoration: underline;
}
.beforecordinate::before {
content: "";
display: block;
width: 100%;
height: 799px;
position: absolute;
bottom: 405px;
background-image: url(../images/blanc/bg-01.png);
background-position: center center;
background-size: cover;
background-repeat: no-repeat;
z-index: -1;
}

/*===== coordinate =====*/
.coordinate {
position: relative;
}
.coordinate .inner {
text-align: left;
position: relative;
min-width: 1000px;
margin: 0 auto;
}
.coordinate .inner::after {
content: "";
display: block;
width: 855px;
height: 771px;
position: absolute;
top: 0;
left: 50%;
margin-left: -427px;
background-image: url(https://tomorrowland.jp/topic/mystandard/assets/images/blanc/bg-05.png);
background-size: cover;
background-position: center center;
z-index: -1;
}


/*===== style01 =====*/

.style01 {
height: 5164px;
margin-bottom: 167px;
position: relative;
}
.style01 .subinner {
position: relative;
width: 1000px;
height: 100%;
margin: 0 auto;
text-align: center;
}
.style01 .img01 {
width: 573px;
position: absolute;
top: 0;
left: 0;
}
.style01 p.txt01 {
width: 390px;
font-size: 18px;
line-height: 2;
position: absolute;
top: 0;
right: 0;
letter-spacing: -0.06em;
text-align: left;
}
.style01 .img02 {
width: 575px;
position: absolute;
top: 810px;
right: 0;
}
.style01 .leadtxt {
font-size: 27px;
line-height: 2;
text-align: center;
position: absolute;
top: 1048px;
left: -10px;
}
.style01 .img03 {
width: 573px;
position: absolute;
top: 1438px;
left: 0;
}
.style01 p.txt02 {
width: 392px;
font-size: 18px;
line-height: 2;
position: absolute;
top: 1711px;
right: 0;
letter-spacing: -0.06em;
text-align: left;
}
.style01 .img04 {
width: 764px;
position: absolute;
top: 2376px;
left: 50%;
margin-left: -382px;
}
.style01 p.txt03 {
width: 386px;
font-size: 18px;
line-height: 2;
position: absolute;
top: 3702px;
right: 0;
text-align: left;
}
.style01 p.txt04 {
width: 100%;
font-size: 18px;
line-height: 2;
position: absolute;
top: 4604px;
left: 0;
text-align: left;
}
.style01 .img05 {
width: 573px;
position: absolute;
top: 3702px;
left: 0;
}
.style01 .lastlead {
width: 100%;
font-size: 27px;
line-height: 2;
text-align: center;
position: absolute;
bottom: 0;
}
.style01 .subinner::before {
content: "";
display: block;
width: 883px;
height: 810px;
position: absolute;
top: 687px;
left: -217px;
background-image: url(../images/blanc/bg-03.png);
background-size: cover;
background-position: center center;
z-index: -1;
}
.style01 .subinner::after {
content: "";
display: block;
width: 807px;
height: 796px;
position: absolute;
top: 1989px;
right: -254px;
background-image: url(../images/blanc/bg-02.png);
background-size: cover;
background-position: center center;
z-index: -1;
}
.style01::after {
content: "";
display: block;
width: 100%;
height: 799px;
position: absolute;
bottom: 1144px;
left: 0;
background-image: url(../images/blanc/bg-01.png);
background-size: cover;
background-position: center center;
z-index: -1;
}



/*===== style02 =====*/
.style02 {
height: 2461px;
position: relative;
}
.style02 .subinner {
position: relative;
width: 1000px;
height: 100%;
margin: 0 auto;
text-align: center;
}
.style02 .img01 {
width: 761px;
margin: 0 auto;
}
.style02 p.txt01 {
width: 100%;
font-size: 18px;
line-height: 2;
margin-top: 175px;
text-align: left;
}
.style02 p.txt02 {
width: 394px;
font-size: 18px;
line-height: 2;
position: absolute;
top: 1610px;
left: 0;
letter-spacing: -0.06em;
text-align: left;
}
.style02 .img02 {
width: 573px;
position: absolute;
bottom: 0;
right: 0;
}
.style02 .subinner::before {
content: "";
display: block;
width: 883px;
height: 810px;
position: absolute;
top: 885px;
left: -133px;
background-image: url(../images/blanc/bg-03.png);
background-size: cover;
background-position: center center;
z-index: -1;
}

/*===== buyarea =====*/
.buyarea {
position: relative;
margin-top: 227px;
}
.buyarea .subinner {
width: 1115px;
margin: 0 auto;
padding-left: 63px;
}
.buyarea .article {
margin-bottom: 230px;
position: relative;
}
.buyarea .article:last-child {
margin-bottom: 175px;
}
.buyarea .article figure {
width: 521px;
float: left;
margin-right: 55px;
position: relative;
}
.buyarea .article figcaption {
width: 535px;
height: 651px;
display: flex;
flex-direction: column; /* 子要素をflexboxにより縦方向に揃える */
justify-content: center; /* 子要素をflexboxにより中央に配置する */
float: left;
position: relative;
text-align: left;
}
.buyarea .article:nth-of-type(1) figcaption h3 {
font-size: 27px;
line-height: 2;
position: absolute;
top: 227px;
}
.buyarea .article:nth-of-type(2) figcaption h3 {
font-size: 27px;
line-height: 2;
position: absolute;
top: 193px;
}
.buyarea .article figcaption ul {
position: absolute;
bottom: 0;
}
.buyarea .article figcaption ul li {
font-size: 18px;
line-height: 2;
letter-spacing: -0.025em;
}
.buyarea .article figcaption ul li a {
color: #a07f50;
text-decoration: underline;
}
.buyarea .style1 h2 {
width: 211px;
position: absolute;
top: -48px;
left: 43px;
margin: 0;
z-index: 2;
}
.buyarea .style2 h2 {
width: 227px;
position: absolute;
top: -48px;
left: 43px;
margin: 0;
z-index: 2;
}

/* ================================================= */
/* ==================== PC END. ====================== */
/* =============================================== */

}


@media screen and (min-width:1441px) {

.wrapper {
min-width: 1440px;
text-align: center;
overflow: hidden;
}

/*===== mainvisual =====*/
.mainvisual {
min-width: 1334px;
margin: 0 auto;
}
.mainvisual p {
font-size: 36px;
line-height: 1.667;
margin-top: 142px;
margin-bottom: 28px;
letter-spacing: 0.01em;
}

/*===== itemdetail =====*/
.introduction {
position: relative;
min-width: 1334px;
margin: 0 auto;
padding-top: 456px;
overflow: hidden;
}
.introduction::before {
content: "";
display: block;
width: 100%;
height: 1065px;
position: absolute;
top: 0;
background-image: url(../images/blanc/bg-01.png);
background-position: center center;
background-size: cover;
background-repeat: no-repeat;
z-index: -1;
}
.introduction h2 {
width: 750px;
margin: 0 auto;
color: #009b32;
margin-bottom: 417px;
}
.introduction h2 img {
width: 100%;
height: auto;
}
.introduction p {
font-size: 36px;
line-height: 2;
letter-spacing: 0.01em;
}
.positionrelative {
position: relative;
width: 1018px;
margin: 0 auto;
padding-top: 354px;
}
.positionrelative::before {
content: "";
display: block;
width: 1584px;
height: 1453px;
position: absolute;
top: -113px;
left: -313px;
background-image: url(../images/blanc/bg-03.png);
background-size: cover;
background-position: center center;
z-index: -1;
}
.positionrelative h3 {
width: 750px;
margin: 0 auto 96px;
}
.positionrelative .img01 {
width: 1018px;
margin: 0 auto;
}
.positionrelative p {
width: 1018px;
margin: 100px auto 147px;
font-size: 24px;
text-align: justify;
text-justify: inter-ideograph;
line-height: 2;
}

.detailarea {
position: relative;
}
.detailarea::after {
content: "";
display: block;
width: 1076px;
height: 1061px;
position: absolute;
top: 1135px;
right: 0;
background-image: url(../images/blanc/bg-02.png);
background-size: cover;
background-position: center center;
z-index: -1;
}
.detailarea h4 {
width: 366px;
margin: 0 auto 133px;
}
.detailarea .block01 {
margin: 0 auto 183px;
text-align: left;
}
.detailarea .block01 img {
width: 723px;
margin-bottom: 66px;
}
.detailarea .block01 dl dt {
font-size: 32px;
margin-bottom: 60px;
}
.detailarea .block01 dl dd {
font-size: 24px;
line-height: 2;
}
.detailarea .block01 .btn a {
display: inline-block;
margin-top: 50px;
width: 176px;
height: 69px;
line-height: 69px;
text-align: center;
font-size: 20px;
color: #000000;
background-color: #ffffff;
}
.detailarea .block02 {
margin: 0 auto 149px;
text-align: right;
}
.detailarea .block02 img {
width: 723px;
margin-bottom: 66px;
}
.detailarea .block02 dl dt {
font-size: 32px;
margin-bottom: 60px;
}
.detailarea .block02 dl dd {
font-size: 24px;
line-height: 2;
}
.detailarea .block02 .btn a {
display: inline-block;
margin-top: 50px;
width: 176px;
height: 69px;
line-height: 69px;
text-align: center;
font-size: 20px;
color: #000000;
background-color: #ffffff;
}
.colorsarea {
position: relative;
}
.colorsarea::after {
content: "";
display: block;
width: 977px;
height: 1065px;
position: absolute;
top: 620px;
right: -200px;
background-image: url(../images/blanc/bg-04.png);
background-size: cover;
background-position: center center;
z-index: -1;
}
.colorsarea h4 {
width: 338px;
margin: 0 auto 130px;
}
.colorsarea .block01 {
margin: 0 auto 60px;
text-align: left;
}
.colorsarea .block01 img {
width: 722px;
margin-bottom: 66px;
}
.colorsarea .block01 dl dt {
font-size: 32px;
margin-bottom: 60px;
}
.colorsarea .block01 dl dd {
font-size: 24px;
line-height: 2;
}
.colorsarea .block02 {
margin: 0 auto 158px;
text-align: right;
}
.colorsarea .block02 img {
width: 722px;
margin-bottom: 66px;
}
.colorsarea .block02 dl dt {
font-size: 32px;
margin-bottom: 60px;
}
.colorsarea .block02 dl dd {
font-size: 24px;
line-height: 2;
}
.introduction .buyerarea {
width: 775px;
margin: 0 auto 112px;
padding-left: 67px;
position: relative;
}
.introduction .buyerarea .img {
width: 348px;
margin-right: 41px;
float: left;
}
.introduction .buyer {
width: 388px;
text-align: left;
font-size: 18px;
line-height: 1.666;
position: absolute;
right: 0;
bottom: 0;
}
.introduction .buyer dt {
font-size: 24px;
margin-bottom: 30px;
line-height: 1.25;
}
.introduction .buyer dt span {
display: block;
margin: 0 0 45px 0;
font-size: 18px;
}
.introduction .buyer dd {
font-size: 18px;
line-height: 1.667;
}

/*===== beforecordinate =====*/
.beforecordinate {
min-width: 1000px;
margin: 0 auto 350px;
position: relative;
overflow: hidden;
}
.beforecordinate .inner {
text-align: center;
margin: 0 auto;
position: relative;
}
.beforecordinate h2 {
width: 783px;
height: 630px;
margin: 0 auto 511px;
padding-top: 334px;
z-index: 2;
}
.beforecordinate h2::after {
content: "";
display: block;
width: 1420px;
height: 1303px;
position: absolute;
top: 0;
left: 50%;
margin-left: -710px;
background-image: url(../images/blanc/bg-03.png);
background-size: cover;
background-position: center center;
z-index: -1;
}
.beforecordinate .img01 {
width: 1018px;
margin-bottom: 351px;
}
.beforecordinate .blancmodel {
width: 1025px;
margin: 0 auto;
padding-left: 8px;
display: flex;
flex-direction: row-reverse;
}
.beforecordinate .blancmodel img {
width: 613px;
}
.beforecordinate .blancmodel dl {
margin-top: auto;
margin-right: 30px;
text-align: left;
}
.beforecordinate .blancmodel dl dt {
font-size: 24px;
margin-bottom: 30px;
}
.beforecordinate .blancmodel dl dd {
font-size: 18px;
line-height: 1.57;
}
.beforecordinate .blancmodel dl dd span {
display: block;
margin-top: 20px;
}
.beforecordinate .blancmodel dl dd span a {
color: #000000;
text-decoration: underline;
}
.beforecordinate::before {
content: "";
display: block;
width: 100%;
height: 1065px;
position: absolute;
bottom: 540px;
background-image: url(../images/blanc/bg-01.png);
background-position: center center;
background-size: cover;
background-repeat: no-repeat;
z-index: -1;
}

/*===== coordinate =====*/
.coordinate {
position: relative;
}
.coordinate .inner {
text-align: left;
position: relative;
min-width: 1334px;
margin: 0 auto;
}
.coordinate .inner::after {
content: "";
display: block;
width: 855px;
height: 771px;
position: absolute;
top: 0;
left: 50%;
margin-left: -427px;
background-image: url(https://tomorrowland.jp/topic/mystandard/assets/images/blanc/bg-05.png);
background-size: cover;
background-position: center center;
z-index: -1;
}


/*===== style01 =====*/

.style01 {
height: 6890px;
margin-bottom: 222px;
position: relative;
}
.style01 .subinner {
position: relative;
width: 1334px;
height: 100%;
margin: 0 auto;
text-align: center;
}
.style01 h3 {
width: 211px;
position: absolute;
top: 0;
right: 0;
z-index: 2;
}
.style01 .img01 {
width: 765px;
position: absolute;
top: 0;
left: 0;
}
.style01 p.txt01 {
width: 520px;
font-size: 24px;
line-height: 2;
position: absolute;
top: 0;
right: 0;
letter-spacing: -0.06em;
text-align: left;
}
.style01 .img02 {
width: 767px;
position: absolute;
top: 1081px;
right: 0;
}
.style01 .leadtxt {
font-size: 36px;
line-height: 2;
text-align: center;
position: absolute;
top: 1396px;
left: -12px;
}
.style01 .img03 {
width: 765px;
position: absolute;
top: 1918px;
left: 0;
}
.style01 p.txt02 {
width: 523px;
font-size: 24px;
line-height: 2;
position: absolute;
top: 2283px;
right: 0;
letter-spacing: -0.06em;
text-align: left;
}
.style01 .img04 {
width: 1020px;
position: absolute;
top: 3168px;
left: 50%;
margin-left: -510px;
}
.style01 p.txt03 {
width: 515px;
font-size: 24px;
line-height: 2;
position: absolute;
top: 4934px;
right: 0;
text-align: left;
}
.style01 p.txt04 {
width: 100%;
font-size: 24px;
line-height: 2;
position: absolute;
top: 6140px;
left: 0;
text-align: left;
}
.style01 .img05 {
width: 766px;
position: absolute;
top: 4934px;
left: 0;
}
.style01 .lastlead {
width: 100%;
font-size: 36px;
line-height: 2;
text-align: center;
position: absolute;
bottom: 0;
}
.style01 .subinner::before {
content: "";
display: block;
width: 883px;
height: 810px;
position: absolute;
top: 687px;
left: -217px;
background-image: url(../images/blanc/bg-03.png);
background-size: cover;
background-position: center center;
z-index: -1;
}
.style01 .subinner::after {
content: "";
display: block;
width: 807px;
height: 796px;
position: absolute;
top: 1989px;
right: -254px;
background-image: url(../images/blanc/bg-02.png);
background-size: cover;
background-position: center center;
z-index: -1;
}
.style01::after {
content: "";
display: block;
width: 100%;
height: 799px;
position: absolute;
bottom: 1144px;
left: 0;
background-image: url(../images/blanc/bg-01.png);
background-size: cover;
background-position: center center;
z-index: -1;
}


/*===== style02 =====*/
.style02 {
height: 3283px;
position: relative;
}
.style02 .subinner {
position: relative;
width: 1334px;
height: 100%;
margin: 0 auto;
text-align: center;
}
.style02 .img01 {
width: 1016px;
margin: 0 auto;
}
.style02 p.txt01 {
width: 100%;
font-size: 24px;
line-height: 2;
margin-top: 232px;
text-align: left;
}
.style02 p.txt02 {
width: 525px;
font-size: 24px;
line-height: 2;
position: absolute;
top: 2146px;
left: 0;
letter-spacing: -0.06em;
text-align: left;
}
.style02 .img02 {
width: 766px;
position: absolute;
bottom: 0;
right: 0;
}
.style02 .subinner::before {
content: "";
display: block;
width: 883px;
height: 810px;
position: absolute;
top: 885px;
left: -133px;
background-image: url(../images/blanc/bg-03.png);
background-size: cover;
background-position: center center;
z-index: -1;
}

/*===== buyarea =====*/
.buyarea {
position: relative;
margin-top: 305px;
}
.buyarea .subinner {
width: 1445px;
margin: 0 auto;
padding-left: 57px;
}
.buyarea .article {
margin-bottom: 305px;
position: relative;
}
.buyarea .article:last-child {
margin-bottom: 232px;
}
.buyarea .article figure {
width: 704px;
float: left;
margin-right: 58px;
position: relative;
}
.buyarea .article figcaption {
width: 682px;
height: 880px;
display: flex;
flex-direction: column; /* 子要素をflexboxにより縦方向に揃える */
justify-content: center; /* 子要素をflexboxにより中央に配置する */
float: left;
position: relative;
text-align: left;
}
.buyarea .article:nth-of-type(1) figcaption h3 {
font-size: 36px;
line-height: 2;
position: absolute;
top: 309px;
}
.buyarea .article:nth-of-type(2) figcaption h3 {
font-size: 36px;
line-height: 2;
position: absolute;
top: 266px;
}
.buyarea .article figcaption ul {
position: absolute;
bottom: 0;
}
.buyarea .article figcaption ul li {
font-size: 24px;
line-height: 2;
letter-spacing: -0.025em;
}
.buyarea .article figcaption ul li a {
color: #a07f50;
text-decoration: underline;
}
.buyarea .style1 h2 {
width: 280px;
position: absolute;
top: -51px;
left: 73px;
margin: 0;
z-index: 2;
}
.buyarea .style2 h2 {
width: 303px;
position: absolute;
top: -51px;
left: 73px;
margin: 0;
z-index: 2;
}


}


/* ================================================================= */
/* ======================== 1921px以上 ============================= */
/* ============================================================== */

@media screen and (min-width:1921px) {

.introduction {
padding-top: 23.75%;
}
.introduction::before,
.beforecordinate:before,
.style01::after {
padding-top: 55.46875%;
height: 0;
}

/* ================================================= */
/* ==================== PC END. ====================== */
/* =============================================== */

}