@charset "utf-8";
/* CSS Document */

img {width: 100%;}



h1 {
    text-align: center;
}





.introduction {
    margin: 0 auto;
    max-width: 100%;
    position: relative;
    padding-top: 40px;
}
.introduction::before {
    background-color: #e9d269;
    bottom: 0;
    content: "";
    height: 1433px;
    left: 0;
    position: absolute;
    width: 100%;
    z-index: -99;
}

.introduction__image__maintitle {
width: 700px;
}

.introduction__image {
    max-width: 700px;
    margin: 0 auto;
}


p.introduction__textarea__text {
    font-size: 1.2rem;
    text-align: left;
    margin: 3rem 0;
}





.introduction__textarea, .introduction__modelarea{
width: 700px;
 margin: 0 auto;
}


.introduction__modelarea {
    padding: 50px 0;
}

p.introduction__modelarea__text {
    text-align: center;
    font-size: 1rem;
    width: 90%;
    margin: 2em auto;
}
p.model_choice {
    text-align: center;
    font-weight: 600;
    margin-bottom: 1em;
    font-size: 1rem;
}

/* -------------------- 記事 -------------------- */

.article {
    margin: 0 auto;
    padding: 80px 0;
    width: 100%;
    max-width: 960px;
}






.article__inner__image img {
    border-radius: 32px;
}




.parent {
display: grid;
grid-template-columns: repeat(2, 1fr);
grid-template-rows: 1fr;
grid-column-gap: 20px;
grid-row-gap: 20px;
}

.div1 { grid-area: 1 / 1 / 2 / 2; }
.div2 { grid-area: 1 / 2 / 2 / 3; }



.parent2 {
display: grid;
grid-template-columns: repeat(2, 1fr);
grid-template-rows: repeat(2, 1fr);
grid-column-gap: 20px;
grid-row-gap: 20px;
}

.div2a { grid-area: 1 / 1 / 2 / 2; }
.div2b { grid-area: 1 / 2 / 2 / 3; }
.div2c { grid-area: 2 / 1 / 3 / 2; }
.div2d { grid-area: 2 / 2 / 3 / 3; }






.subimage:last-child {
margin-bottom: 0;
}

.inner__image__right {
    margin-bottom: 20px;
	width: 70%;
}





.article__inner__text {
    padding: 20px;
}


.article__inner__text__text {
    font-size: 1rem;
}

.article__inner__text__item {
    margin-top: 0.5rem;
}



/* -------------------- クーポン -------------------- */


.btn--orange,
a.btn--orange {
}
.btn--orange:hover,
a.btn--orange:hover {
  color: #fff;
  background: #f56500;
}

a.btn--radius {
   border-radius: 100vh;
}

.introduction__textarea__link {
    text-align: center;
    border: solid 3px;
    width: 80%;
    max-width: 600px;
    display: block;
    margin: 0 auto;
    line-height: 4;
    font-size: 1rem;
    color: #FFF!important;
}


.introduction__textarea__link a {
    color: #FFF!important;
}

.itemlist__inner {
display: grid;
grid-template-columns: repeat(4, 1fr);
grid-template-rows: repeat(4, 1fr);
grid-column-gap: 20px;
grid-row-gap: 20px;
}

.item1 { grid-area: 1 / 1 / 2 / 2; }
.item2 { grid-area: 1 / 2 / 2 / 3; }
.item3 { grid-area: 1 / 3 / 2 / 4; }
.item4 { grid-area: 1 / 4 / 2 / 5; }
.item5 { grid-area: 2 / 1 / 3 / 2; }
.item6 { grid-area: 2 / 2 / 3 / 3; }
.item7 { grid-area: 2 / 3 / 3 / 4; }
.item8 { grid-area: 2 / 4 / 3 / 5; }



    
.itemlist__inner2 {
display: grid;
grid-template-columns: repeat(4, 1fr);
grid-template-rows: repeat(2, 1fr);
grid-column-gap: 20px;
grid-row-gap: 20px;
}

.item1 { grid-area: 1 / 1 / 2 / 2; }
.item2 { grid-area: 1 / 2 / 2 / 3; }
.item3 { grid-area: 1 / 3 / 2 / 4; }
.item4 { grid-area: 1 / 4 / 2 / 5; }
.item5 { grid-area: 2 / 1 / 3 / 2; }
.item6 { grid-area: 2 / 2 / 3 / 3; }
.item7 { grid-area: 2 / 3 / 3 / 4; }
.item8 { grid-area: 2 / 4 / 3 / 5; }
    
    
    
.itemlist img {

    border-radius: 16px;
	}


.itemlist_number {
    position: absolute;
    top: 1em;
    right: 1em;
}
    
 .article__title {
    text-align: center;
    font-size: 2rem;
    font-weight: 600;
    letter-spacing: 3px;
}

.article__no {
    text-align: center;
    text-decoration: underline;
    font-size: 1rem;
    font-weight: 600;
}


.itemlist {
    margin: 100px 5%;
    width: 90%;
}   
    
/* --------------------記事固有のcss -------------------- */
.article_2_1 {
    width: 60%;
    margin: auto;
}

.article_2_1 img,.article_2_2 img {
    margin-bottom: 20px;
}

.knit_01 {
    width: 60%;
    margin-left: 40%;
}

.knit_02 {
    width: 50%;
    margin-left: 15%;
}
/* --------------------モデル画像 -------------------- */

img.img_model {
}


img.check_01 {
    width: 50%;
    margin-left: 20%;
    margin-right: 20%;
	margin-bottom: 100px;
}

img.check_02 {
    width: 60%;
}








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

}
@media screen and (max-width: 724px){
    
    
  
.introduction__textarea, .introduction__modelarea{
width: 94%;
 margin: 0 auto;
}  
    
    
p.introduction__textarea__text {
    font-size: 1rem;
    text-align: left;
    margin: 2rem auto;
    width: 90%;
    margin: a;
}
    
    
.introduction__image__maintitle {
    width: 90%;
    margin: 20px auto;
}
    
    .article__inner__image {
    width: 90%;
    margin: 5%;
}
 .article__title {
    text-align: center;
    font-size: 1.5rem;
    font-weight: 600;
    letter-spacing: 1px;
    margin: 0 10px;
}   
.parent {
    display: block;
}

.inner__image__right {
    margin-bottom: 20px;
    width: 80%;
    margin: 30px 10%;
}
    
.itemlist__inner {
display: grid;
grid-template-columns: repeat(2, 1fr);
grid-template-rows: repeat(4, 1fr);
grid-column-gap: 10px;
grid-row-gap: 10px;
}

   .itemlist__inner2 {
display: grid;
grid-template-columns: repeat(2, 1fr);
grid-template-rows: repeat(4, 1fr);
grid-column-gap: 10px;
grid-row-gap: 10px;
} 
    
    
    
.item1 { grid-area: 1 / 1 / 2 / 2; }
.item2 { grid-area: 1 / 2 / 2 / 3; }
.item3 { grid-area: 2 / 1 / 3 / 2; }
.item4 { grid-area: 2 / 2 / 3 / 3; }
.item5 { grid-area: 3 / 1 / 4 / 2; }
.item6 { grid-area: 3 / 2 / 4 / 3; }
.item7 { grid-area: 4 / 1 / 5 / 2; }
.item8 { grid-area: 4 / 2 / 5 / 3; }



.item1 ,.item2 ,.item3 ,.item4 ,.item5 ,.item6 ,.item7 ,.item8 ,.item9 ,.item10 ,.item11 ,.item12 ,.item13 ,.item14 ,.item15 ,.item16 {
position: relative;
}


.knit_01 {
    width: 100%;
    margin-left: auto;
}
    
    .knit_02 {
    width: 90%;
    margin: auto 5%;
    }
    
img.check_01 {
    width: 90%;
    margin: 0 5%;
}   
    
        
img.check_02 {
    width: 90%;
    margin: 0 5%;
}  
    
   }