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


/* ************************************************************
レスポンシブ画像切り替え（基本的なブレイクポイントではpc,mb、イレギュラーな部分だけ02,03等つけていく）
************************************************************ */

.pc1024{display:none;}
.mb1024{display:none;}
.pc768{display:block;}
.mb768{display: none;} 
.pc600{display:block;}
.mb600{display: none;} 
.pc480{display:block;}
.mb480{display: none;} 
.pc380{display:block;}
.mb380{display: none;} 

/* ▼▼▼▼▼▼▼▼MaxWidth1024▼▼▼▼▼▼▼▼ */
@media screen and (max-width: 1024px) {
 /* ************** */
 
.pc1024{display:none;}
.mb1024{display: block;} 

 /* *************** */
	}

/* ▼▼▼▼▼▼▼▼MaxWidth768▼▼▼▼▼▼▼▼ */
@media screen and (max-width: 768px) {
 /* ************** */

.pc768{display:none;}
.mb768{display: block;} 

 /* *************** */
	}


/* ▼▼▼▼▼▼▼▼MaxWidth768▼▼▼▼▼▼▼▼ */
@media screen and (max-width: 600px) {
 /* ************** */

.pc600{display:none;}
.mb600{display: block;} 

 /* *************** */
	}


/* ▼▼▼▼▼▼▼▼MaxWidth768▼▼▼▼▼▼▼▼ */
@media screen and (max-width: 480px) {
 /* ************** */

.pc480{display:none;}
.mb480{display: block;} 

 /* *************** */
	}


/* ▼▼▼▼▼▼▼▼MaxWidth768▼▼▼▼▼▼▼▼ */
@media screen and (max-width: 380px) {
 /* ************** */

.pc380{display:none;}
.mb380{display: block;} 

 /* *************** */
	}


/** --------------------------------------------------
lineup-subvisual
-------------------------------------------------- **/
#lineup-renewal2022 #lineup-subvisual{
margin: 0 auto;
width: 100%;
}

#lineup-renewal2022 #lineup-subvisual .bar{
margin: 0 auto;
padding-top: 180px;
width: 100%;
height: 800px;

background-image: url("../img/lineup-new/lineup-new-subvisual.jpg");
background-size:cover;
background-repeat: no-repeat;
background-position:center;
}

#lineup-renewal2022 #lineup-subvisual .bar h2{
text-align: center!important;
margin:0 auto;
width: 100%;
color: #fff;
font-size: 200px;
font-family: 'Bebas Neue', cursive;
opacity: .8;
position: relative;
}

#lineup-renewal2022 #lineup-subvisual .bar h2::after{
content:"";
display:block;
width:300px;
height:10px;
background:#fff;
position:absolute;
bottom:-30px;
left:50%;
transform: translateX(-50%);
}

#lineup-renewal2022 #lineup-subvisual .bar h3{
text-align: center!important;

margin:80px auto 0;
width: 100%;
font-size: 37px;
font-weight: 600;
color: #fff;
}

#lineup-renewal2022 #lineup-subvisual .bar p{
text-align: center!important;

margin-top: 30px;
width: 100%;
font-size: 13px;
line-height: 2;
letter-spacing: 0.05em;
color: #fff;
}

/* ******************************************* */
@media screen and (max-width: 1500px) {
 /* ---------------------------------- */
#lineup-renewal2022 #lineup-subvisual .bar{height: 700px;}
#lineup-renewal2022 #lineup-subvisual .bar h2{font-size: 150px;}
#lineup-renewal2022 #lineup-subvisual .bar h2::after{width:200px;}

#lineup-renewal2022 #lineup-subvisual .bar h3{
margin-top: 70px;
font-size: 30px;
}

#lineup-renewal2022 #lineup-subvisual .bar p{font-size: 12px;}
 /* ---------------------------------- */
}

/* ******************************************* */
@media screen and (max-width: 1200px) {
 /* ---------------------------------- */
#lineup-renewal2022 #lineup-subvisual .bar{
height: 600px;
padding-top: 150px;
}

#lineup-renewal2022 #lineup-subvisual .bar h2{font-size: 130px;}
#lineup-renewal2022 #lineup-subvisual .bar h2::after{width:200px;}
#lineup-renewal2022 #lineup-subvisual .bar h3{font-size: 25px;}
#lineup-renewal2022 #lineup-subvisual .bar p{font-size: 11px;}
 /* ---------------------------------- */
}


/* ******************************************* */
@media screen and (max-width: 768px) {
 /* ---------------------------------- */
#lineup-renewal2022 #lineup-subvisual .bar{
height: 500px;
padding-top: 110px;
}

#lineup-renewal2022 #lineup-subvisual .bar h2{font-size: 115px;}

#lineup-renewal2022 #lineup-subvisual .bar h2::after{
width:150px;
height: 7px;
}

#lineup-renewal2022 #lineup-subvisual .bar h3{font-size: 23px;}
#lineup-renewal2022 #lineup-subvisual .bar p{font-size: 10px;}
 /* ---------------------------------- */
}

/* ******************************************* */
@media screen and (max-width: 480px) {
 /* ---------------------------------- */
#lineup-renewal2022 #lineup-subvisual .bar{
padding-top: 70px;
height: 400px;
}

#lineup-renewal2022 #lineup-subvisual .bar h2{font-size: 90px;}

#lineup-renewal2022 #lineup-subvisual .bar h2::after{
width:100px;
height: 5px;
}

#lineup-renewal2022 #lineup-subvisual .bar h3{
margin-top: 60px;
font-size: 20px;
}

#lineup-renewal2022 #lineup-subvisual .bar p{margin-top: 15px;}

 /* ---------------------------------- */
}

/* ******************************************* */
@media screen and (max-width: 380px) {
 /* ---------------------------------- */

 /* ---------------------------------- */
}


/** --------------------------------------------------
block01
-------------------------------------------------- **/
#lineup-renewal2022 #block01{
margin: 0 auto;
width: 100%;
background: #ffe233;
}

#lineup-renewal2022 #block01 article{
margin: 0 auto;
height: 550px;
position: relative;
}

#lineup-renewal2022 #block01 article .h2-text{
margin: 0 auto;
padding: 120px 60px 80px;
height: 550px;
background: #fff;
position: absolute;
top: 0;
left: 50%;
transform: translateX(-50%);
z-index: 1;
}

#lineup-renewal2022 #block01 article .h2-text h2{
-ms-writing-mode: tb-rl;
writing-mode: vertical-rl;
margin: 0 auto;
width: 100%;
font-size: 19px;
font-weight: 500;
line-height: 2.3;
letter-spacing: 0.05em;
position: relative;
}

#lineup-renewal2022 #block01 article .h2-text h2::after{
content:"";
display:block;
width:200px;
height:7px;
background:#ffe233;
position:absolute;
top:-45px;
left:50%;
transform: translateX(-50%);
}

#lineup-renewal2022 #block01 article ul{
margin: 0 auto;
width: 100%;
position: absolute;
top: 100px;
left: 50%;
transform: translateX(-50%);
}

#lineup-renewal2022 #block01 article ul li{
margin: 0 auto;
width: 100%;
height: 400px;
}

#lineup-renewal2022 #block01 article ul li img{object-fit: cover;}

#lineup-renewal2022 #block01 p{
text-align: center;
margin: 0 auto;
width: 1000px;
mix-blend-mode: multiply;
}

#lineup-renewal2022 #block01 p img{max-width: 100%;}

/* ******************************************* */
@media screen and (max-width: 1500px) {
 /* ---------------------------------- */
#lineup-renewal2022 #block01 article{height: 500px;}

#lineup-renewal2022 #block01 article .h2-text{
padding: 120px 60px 80px;
height: 500px;
}

#lineup-renewal2022 #block01 article .h2-text h2{font-size: 17px;}

#lineup-renewal2022 #block01 article .h2-text h2::after{
width:180px;
top:-55px;
}

#lineup-renewal2022 #block01 p{width: 1000px;}

 /* ---------------------------------- */
}

/* ******************************************* */
@media screen and (max-width: 1200px) {
 /* ---------------------------------- */
#lineup-renewal2022 #block01 article{height: 430px;}

#lineup-renewal2022 #block01 article .h2-text{
padding: 110px 50px 0;
height: 430px;
}

#lineup-renewal2022 #block01 article .h2-text h2{font-size: 15px;}

#lineup-renewal2022 #block01 article .h2-text h2::after{
width:150px;
top:-50px;
}

#lineup-renewal2022 #block01 p{width: 700px;}
 /* ---------------------------------- */
}

/* ******************************************* */
@media screen and (max-width: 1024px) {
 /* ---------------------------------- */
#lineup-renewal2022 #block01 article{height: 400px;}

#lineup-renewal2022 #block01 article .h2-text{
padding: 90px 50px 0;
height: 400px;
}

#lineup-renewal2022 #block01 article .h2-text h2{font-size: 14px;}

#lineup-renewal2022 #block01 article .h2-text h2::after{
width:140px;
top:-60px;
}

#lineup-renewal2022 #block01 p{width: 600px;}
 /* ---------------------------------- */
}

/* ******************************************* */
@media screen and (max-width: 768px) {
 /* ---------------------------------- */
#lineup-renewal2022 #block01 article{height: 320px;}

#lineup-renewal2022 #block01 article .h2-text{
padding: 70px 40px 20px;
height: 320px;
}

#lineup-renewal2022 #block01 article .h2-text h2{font-size: 12px;}

#lineup-renewal2022 #block01 article .h2-text h2::after{
width:120px;
top:-35px;
}

#lineup-renewal2022 #block01 article ul{top: 65px;}

#lineup-renewal2022 #block01 p{width: 500px;}
 /* ---------------------------------- */
}

/* ******************************************* */
@media screen and (max-width: 600px) {
 /* ---------------------------------- */
#lineup-renewal2022 #block01 p{width: 450px;}
 /* ---------------------------------- */
}

/* ******************************************* */
@media screen and (max-width: 480px) {
 /* ---------------------------------- */
#lineup-renewal2022 #block01 article{height: 450px;}

#lineup-renewal2022 #block01 article .h2-text{
padding: 120px 40px 0px;
height: 450px;
}

#lineup-renewal2022 #block01 article .h2-text h2{font-size: 14px;}

#lineup-renewal2022 #block01 article .h2-text h2::after{
width:140px;
top:-50px;
height:5px;
}

#lineup-renewal2022 #block01 article ul{top: 75px;}

#lineup-renewal2022 #block01 p{width: 370px;}
 /* ---------------------------------- */
}

/* ******************************************* */
@media screen and (max-width: 380px) {
 /* ---------------------------------- */
#lineup-renewal2022 #block01 article{height: 350px;}

#lineup-renewal2022 #block01 article .h2-text{
padding: 80px 25px 10px;
height: 350px;
}

#lineup-renewal2022 #block01 article .h2-text h2{
line-height: 2;
font-size: 12px;
}

#lineup-renewal2022 #block01 article .h2-text h2::after{
width:110px;
top:-40px;
}

#lineup-renewal2022 #block01 article ul{top: 55px;}

#lineup-renewal2022 #block01 p{width: 350px;}
 /* ---------------------------------- */
}



/** --------------------------------------------------
block02 リンクバナー
-------------------------------------------------- **/
#lineup-renewal2022 #block02{
margin: 0 auto;
width: 100%;
}

#lineup-renewal2022 #block02 ul{
margin: 15% auto;
width: 70%;
display: flex;
justify-content: center;
align-items: center;
flex-flow: row wrap;
}

#lineup-renewal2022 #block02 ul li{
margin: 0 auto 5%;
width: 45%;
}

/* ******************************************* */
@media screen and (max-width: 1200px) {
 /* ---------------------------------- */
 /* ---------------------------------- */
}

/* ******************************************* */
@media screen and (max-width: 1024px) {
 /* ---------------------------------- */
#lineup-renewal2022 #block02 ul{width: 80%;}
 /* ---------------------------------- */
}

/* ******************************************* */
@media screen and (max-width: 768px) {
 /* ---------------------------------- */
#lineup-renewal2022 #block02 ul{
margin: 20% auto 12%;
width: 90%;
}
 /* ---------------------------------- */
}

/* ******************************************* */
@media screen and (max-width: 680px) {
 /* ---------------------------------- */
 /* ---------------------------------- */
}

/* ******************************************* */
@media screen and (max-width: 600px) {
 /* ---------------------------------- */
#lineup-renewal2022 #block02 ul{
width: 90%;
flex-flow: column wrap;
}

#lineup-renewal2022 #block02 ul li{
margin: 0 auto 7%;
width: 70%;
}
 /* ---------------------------------- */
}


/* ******************************************* */
@media screen and (max-width: 480px) {
 /* ---------------------------------- */
#lineup-renewal2022 #block02 ul{margin: 15% auto;}
#lineup-renewal2022 #block02 ul li{
margin: 0 auto 10%;
width: 85%;
}
 /* ---------------------------------- */
}

/* ******************************************* */
@media screen and (max-width: 380px) {
 /* ---------------------------------- */

 /* ---------------------------------- */
}



/** --------------------------------------------------
block03　商品一蘭
-------------------------------------------------- **/
#lineup-renewal2022 #block03{
text-align: center!important;
margin: 0 auto;
width: 100%;
max-width: 1080px;
}

#lineup-renewal2022 #block03 article{
margin: 17% auto;
width: 100%;
}

#lineup-renewal2022 #block03 article:last-of-type{margin-bottom: 10%;}


#lineup-renewal2022 #block03 article h2{
margin: 0 auto;
width: 100%;
}

#lineup-renewal2022 #block03 article h3{
margin: 35px auto;
width: 100%;
}

/*view moreボタン*/
#lineup-renewal2022 article .more{
margin: 0 auto;
width: 100%;
max-width: 650px;
padding: 15px;
background: #ffe233;
}

#lineup-renewal2022 article .more p{
margin: 0 auto;
width: 100%;
position: relative;
}

#lineup-renewal2022 article .more p::before{
content:"";
display:block;
width:100%;
height:2px;
background:#fff;
position:absolute;
left:50%;
transform: translateX(-50%);
}

/*線　共通指定　色・線幅など*/
#lineup-renewal2022 article .more p::before,
#lineup-renewal2022 article .more p::after{
content:"";
display:block;
width:100%;
height:2px;
background:#fff;
position:absolute;
left:50%;
transform: translateX(-50%);
}

/*位置指定*/
#lineup-renewal2022 article .more p::before{top:-8px;}
#lineup-renewal2022 article .more p::after{bottom:-8px;}


#lineup-renewal2022 article .more p a{
color: #2d2d27;
font-family: 'Outfit', sans-serif;
font-size: 28px;
font-weight: 500;
}

#lineup-renewal2022 article .more p a::after{
content: "▶︎▶︎";
font-size: 16px;
vertical-align: middle;
}

/*マウスホバー　アニメーション*/
#lineup-renewal2022 article .more p:hover a{color: #ffe233;}

#lineup-renewal2022 article .more:hover{
background: #2d2d27;
transition-duration: .5s;
}

#lineup-renewal2022 article .more p:hover::before,
#lineup-renewal2022 article .more p:hover::after{
background:#ffe233;
transition-duration: .5s;
}

/* ******************************************* */
@media screen and (max-width: 768px) {
 /* ---------------------------------- */
#lineup-renewal2022 #block03 article{
margin: 25% auto;
padding: 0 10%;
}

#lineup-renewal2022 #block03 article h3{
margin: 20px auto;
width: 90%;
}

/*view moreボタン*/
#lineup-renewal2022 article .more{
width: 90%;
max-width: 650px;
padding: 10px;
}

#lineup-renewal2022 article .more p a{font-size: 24px;}
#lineup-renewal2022 article .more p a::after{font-size: 16px;}
 /* ---------------------------------- */
}

/* ******************************************* */
@media screen and (max-width: 680px) {
 /* ---------------------------------- */
#lineup-renewal2022 #block03 article{
margin: 17% auto;
padding: 0 5%;
}
 /* ---------------------------------- */
}

/* ******************************************* */
@media screen and (max-width: 680px) {
 /* ---------------------------------- */
#lineup-renewal2022 #block03 article{padding: 0 3%;}
 /* ---------------------------------- */
}



/** --------------------------------------------------
contact
-------------------------------------------------- **/
#lineup-renewal2022 #contact{
margin: 0 auto;
width: 100%;
padding: 5%;

background-image: url( "../img/loan/block08-bg.jpg");
background-size:cover;
background-repeat:repeat;
background-position:center;
}

#lineup-renewal2022 #contact .title{
margin: 0 auto 4%;
width: 500px;
}

/*リンクボタン共通*/
#lineup-renewal2022 #contact div{
text-align: center!important;

margin: 0 auto;
padding: 1.5% 0;
width: 550px;
font-size: 18px;
font-weight: 500;
letter-spacing: 0.05em;
color: #744f4a;
background: rgba(255,255,255,.9);
border-radius: 100px;
}

/*telボタン指定*/
#lineup-renewal2022 #contact .tel h2{
margin: 1% auto 0;
font-size: 60px;
font-family: 'Bebas Neue', cursive;
}

#lineup-renewal2022 #contact .tel h2::before{
content: url( "../img/loan/blocl08-tel-mark.png");
display: inline-block;
vertical-align: middle;
transform: scale(0.7);
padding-right: 5px;
margin-top: 7px;
}

/*LINEボタンのみ色など指定い*/
#lineup-renewal2022 #contact .line{
text-align: center!important;

margin-top: 2%;
font-size: 22px;
font-weight: 700;
color: #fff;
background: #39b353;
}

/*リンクホバー共通*/
#lineup-renewal2022 #contact a:hover{
opacity: 0.7;
transition-duration: 0.5s;
}


/* ******************************************* */
@media screen and (max-width: 1024px) {
 /* ---------------------------------- */
#lineup-renewal2022 #contact{padding: 10%;}
#lineup-renewal2022 #contact .title{margin: 0 auto 7%;}

/*リンクボタン共通*/
#lineup-renewal2022 #contact div{padding: 3% 0;}

/*telボタン指定*/
#lineup-renewal2022 #contact .tel h2{
margin: 0 auto;
font-size: 55px;
}

#lineup-renewal2022 #contact .tel h2::before{
padding-right: 0px;
transform: scale(0.6);
}

/*LINEボタンのみ色など指定*/
#lineup-renewal2022 #contact .line{
margin-top: 4%;
font-size: 20px;
}

 /* ---------------------------------- */
}

/* ******************************************* */
@media screen and (max-width: 768px) {
 /* ---------------------------------- */
#lineup-renewal2022 #contact .title{width: 70%;}

/*リンクボタン共通*/
#lineup-renewal2022 #contact div{
padding: 4% 0;
width: 80%;
}

 /* ---------------------------------- */
}

/* ******************************************* */
@media screen and (max-width: 680px) {
 /* ---------------------------------- */
/*リンクボタン共通*/
#lineup-renewal2022 #contact div{width: 85%;}

 /* ---------------------------------- */
}

/* ******************************************* */
@media screen and (max-width: 600px) {
 /* ---------------------------------- */
#lineup-renewal2022 #contact{padding: 15% 10%;}
#lineup-renewal2022 #contact .title{width: 85%;}
/*リンクボタン共通*/
#lineup-renewal2022 #contact div{
padding: 5% 0;
width: 100%;
font-size: 15px;
}
/*telボタン指定*/
#lineup-renewal2022 #contact .tel h2{
margin-top: 0;
margin-left: -4%;
font-size: 45px;
}

#lineup-renewal2022 #contact .tel h2::before{
transform: scale(0.5);
margin-top: 4px;
}

#lineup-renewal2022 #contact .tel>p:nth-of-type(1){margin-bottom: -2%;}
#lineup-renewal2022 #contact .tel>p:nth-of-type(2){margin-top: -2%;}

/*LINEボタンのみ色など指定*/
#lineup-renewal2022 #contact .line{
margin-top: 6%;
font-size: 16px;
}

 /* ---------------------------------- */
}

/* ******************************************* */
@media screen and (max-width: 480px) {
 /* ---------------------------------- */
#lineup-renewal2022 #contact{padding: 15% 5%;}
#lineup-renewal2022 #contact .title{width: 90%;}
 /* ---------------------------------- */
}

/* ******************************************* */
@media screen and (max-width: 380px) {
 /* ---------------------------------- */
/*LINEボタンのみ色など指定*/
#lineup-renewal2022 #contact .line{
margin-top: 7%;
font-size: 14px;
}
 /* ---------------------------------- */
}