@charset "utf-8";

/* パソコンで見たときは"pc"のclassがついた画像が表示される */ 

.pc { display: block !important; } 

.sp { display: none !important; } 

  

/* スマートフォンで見たときは"sp"のclassがついた画像が表示される */ 

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

    .pc { display: none !important; } 

    .sp { display: block !important; } 
    
    } 

.base-logo02{
    margin-top:10px;
    width:100px;
}

@media screen and (min-width: 992px),
print {
.base-logo02{
    margin-top:10px;
    width:150px;
}
    }
    
/*
+++++++++++++++++++++++++++++++

テキスト類

<span class="marker"></span>

<span class="marker"><strong></strong></span>

<span class="t02">センチュリー21イーハル</span>

+++++++++++++++++++++++++++++++
*/

.t01{
    font-weight: 700;
       
} 

.marker {
  background: linear-gradient(transparent 60%, #FBFD09 60%);
  padding: -3px 5px;
}

.t02{
    color:#F1063E;
       
} 

/*
+++++++++++++++++++++++++++++++

スライダー

+++++++++++++++++++++++++++++++
*/



.main-title {
    
	z-index: 1;
	/*↑z-indexの値をh1のz-indexの値よりも小さくして背景に回す*/
	height: 100vh;/*スライダー全体の縦幅を画面の高さいっぱい（100vh）にする*/
    margin-bottom: 40px;
}

@media screen and (min-width: 992px),
print {
    .main-title {
    margin-bottom: 80px;
}
}




.title-txt{
color:#fff;
    font-size:25px;
    padding:0 15px;
}

@media screen and (min-width: 992px),
print {
   .title-txt{
color:#fff;
    font-size:5vw;
       padding:0;
} 
}


.slider-item01 {
    background:url(../../../../img/blog/title_sp.jpg);
}


@media screen and (min-width: 992px),
print {
   .slider-item01 {
    background:url(../../../../img/blog/title.jpg);
}
    }

.slider-item02 {

    background:url(../../../../img/bai/title_sp.jpg);
}


@media screen and (min-width: 992px),
print {
   .slider-item02 {
    background:url(../../../../img/bai/title.jpg);
}
    }

.slider-item03 {

    background:url(../../../../img/omoi/title_sp.jpg);
}


@media screen and (min-width: 992px),
print {
   .slider-item03 {
    background:url(../../../../img/omoi/title.jpg);
}
    }

.slider-item04 {

    background:url(../../../../img/buy/title_sp.jpg);
}


@media screen and (min-width: 992px),
print {
   .slider-item04 {
    background:url(../../../../img/buy/title.jpg);
}
    }

.slider-item05 {

    background:url(../../../../img/aki/title_sp.jpg);
}


@media screen and (min-width: 992px),
print {
   .slider-item05 {
    background:url(../../../../img/aki/title.jpg);
}
    }

.slider-item06 {

    background:url(../../../../img/nin/title_sp.jpg);
}


@media screen and (min-width: 992px),
print {
   .slider-item06 {
    background:url(../../../../img/nin/title.jpg);
}
    }

.slider-item07 {

    background:url(../../../../img/blog/title_sp.jpg);
}


@media screen and (min-width: 992px),
print {
   .slider-item07 {
    background:url(../../../../img/blog/title.jpg);
}
    }

.slider-item08 {

    background:url(../../../../img/ab/title_sp.jpg);
}


@media screen and (min-width: 992px),
print {
   .slider-item08 {
    background:url(../../../../img/ab/title.jpg);
}
    }

.slider-item09 {

    background:url(../../../../img/kanri/title_sp.jpg);
}


@media screen and (min-width: 992px),
print {
   .slider-item09 {
    background:url(../../../../img/kanri/title.jpg);
}
    }

.slider-item10 {

    background:url(../../../../img/reta/title_sp.jpg);
}


@media screen and (min-width: 992px),
print {
   .slider-item10 {
    background:url(../../../../img/reta/title.jpg);
}
    }

.slider-item {
    width: 100%;/*各スライダー全体の横幅を画面の高さいっぱい（100%）にする*/
    height:100vh;/*各スライダー全体の縦幅を画面の高さいっぱい（100vh）にする*/
    background-repeat: no-repeat;/*背景画像をリピートしない*/
    background-position: center;/*背景画像の位置を中央に*/
    background-size:cover;
    display: flex;
  justify-content: center;
  align-items: center;
}

/*
++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++

title

++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
*/

.title01{
    position: relative;
    display: flex;
    flex-direction: row;
    align-items: flex-end;
    padding:0 0 5px 20px;
    margin-bottom: 40px;
}

@media screen and (min-width: 992px),
print {
    .title01{
    padding:0 0 0 20px;
    margin-bottom:40px;
}
}

.title01::after{
    content:"";
    position: absolute;
    bottom:-10px;
    left:20px;
    height:1px;
    background: #000000;
    width:190px;
}

@media screen and (min-width: 992px),
print {
    .title01::after{
    width:400px;
        bottom:5px;
}
}


.title01::before {
    content:"";
    position: absolute;
    bottom:0;
    left:0;
    height:1px;
    background: #666;
    width:60px;
}

@media screen and (min-width: 992px),
print {
   .title01::before {
    bottom:20px;
}
}


.title01-t01{
    font-size:30px;
    margin-right:10px;
}

@media screen and (min-width: 992px),
print {
    .title01-t01{
        font-size:7vw;
        margin-right:20px;

}
}

.title01-t02{
    font-size:24px;
    margin-right:10px;
}

@media screen and (min-width: 992px),
print {
    .title01-t02{
        font-size:6vw;
        margin-right:20px;
}
}




.title02{
    font-size:23px;
    margin-bottom:15px;
}

@media screen and (min-width: 992px),
print {
    .title02{
    font-size:27px;
    margin-bottom:20px;
}
}

.title03{
    position: relative;
    display: flex;
    flex-direction: row;
    align-items: flex-end;
    padding:0 0 5px 20px;
    margin-bottom: 40px;
}

@media screen and (min-width: 992px),
print {
    .title03{
    padding:0 0 10px 120px;
    margin-bottom:40px;
}
}

.title03::after{
    content:"";
    position: absolute;
    bottom:-10px;
    left:20px;
    height:1px;
    background: #000000;
    width:220px;
}

@media screen and (min-width: 992px),
print {
    .title03::after{
    width:620px;
        bottom:5px;
}
}


.title03::before {
    content:"";
    position: absolute;
    bottom:0;
    left:0;
    height:1px;
    background: #666;
    width:60px;
}

@media screen and (min-width: 992px),
print {
   .title03::before {
    bottom:20px;
}
}

.title03-t01{
    font-size:22px;
    margin-right:10px;
}

@media screen and (min-width: 992px),
print {
    .title03-t01{
        font-size:2.8vw;
        margin-right:20px;
}
}

.title04{
    position: relative;
    display: flex;
    flex-direction: row;
    justify-content: flex-end;
    align-items: flex-end;
    padding:0 0 5px 20px;
    margin-bottom: 40px;
}

@media screen and (min-width: 992px),
print {
    .title04{
    padding:0 120px 10px 0;
    margin-bottom:40px;
}
}

.title04::after{
    content:"";
    position: absolute;
    bottom:-10px;
    right:20px;
    height:1px;
    background: #000000;
    width:320px;
}

@media screen and (min-width: 992px),
print {
    .title04::after{
    width:750px;
        bottom:5px;
}
}


.title04::before {
    content:"";
    position: absolute;
    bottom:0;
    right:0;
    height:1px;
    background: #666;
    width:60px;
}

@media screen and (min-width: 992px),
print {
   .title04::before {
    bottom:20px;
}
}

.title04-t01{
    font-size:22px;
    margin-right:10px;
}

@media screen and (min-width: 992px),
print {
    .title04-t01{
        font-size:2.8vw;
        margin-right:20px;
}
}

.title05{
    text-align: center;
    font-size:17px;
    margin-bottom: 15px;

}

@media screen and (min-width: 992px),
print {
   .title05{
    font-size:1.8vw;
    margin-bottom:70px;
}
}

.title05-t01{
    font-size:12px;
}

@media screen and (min-width: 992px),
print {
   .title05-t01{
    font-size:1.2vw;
}
}

.title06{
    text-align: center;
    font-size:19px;
    margin-bottom:9px;
}

@media screen and (min-width: 992px),
print {
   .title06{
    font-size:2.7vw;
    margin-bottom:15px;
}
}

.title06-t01{
    font-size:12px;
}

@media screen and (min-width: 992px),
print {
   .title06-t01{
    font-size:1.2vw;
}
}

.title07{
    text-align: center;
    font-size:17px;
    margin-bottom:30px;

}

@media screen and (min-width: 992px),
print {
   .title07{
    font-size:1.8vw;
    margin-bottom:70px;
}
}

.title07-t01{
    font-size:12px;
}

@media screen and (min-width: 992px),
print {
   .title07-t01{
    font-size:1.2vw;
}
}

/*
+++++++++++++++++++

.base-con01

++++++++++++++++++++
*/

.base-con01{
    margin:0 auto 40px;
    width:90%;
}

@media screen and (min-width: 768px),
print {
 .base-con01{
    margin:0 auto 100px;
    width:80%;
     display: grid;
     grid-template-columns: 1fr 1fr;
grid-column-gap:80px;
}
}

.base-con01-left{
    margin-bottom: 20px;
}

@media screen and (min-width: 768px),
print {
    .base-con01-left{
    margin-bottom:0;
}
}

.base-con01-left img{
    border-top-left-radius:10px;
    border-bottom-right-radius:18px;

}

.base-con01-right img{
    border-top-right-radius:10px;
    border-bottom-left-radius:18px;

}


/*
++++++++++++++++++

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

@media screen and (min-width: 768px) and (max-width:991px)
{
}

border-top-right-radius:8px;
    border-bottom-right-radius:15px;

/*
+++++++++++++++++++++++++++++++

メインタイトル

.xxx img{
    border-radius:15px; 
}

grid-template-columns: 1fr 1fr;

grid-column-gap:50px;

grid-column-gap:50px;
    grid-template-columns: 1fr 1fr;


+++++++++++++++++++++++++++++++
*/