/*NEWS　スマホ*/

#archive-journal{
width: 80%;
margin: 0 auto;
padding: 100px 0 150px 0;
text-align:left;
}


#archive-journal .layout_kaku_kiji{
width: 100%;
margin: 0 auto 0 auto;
padding: 0 0 0 0;
border-top: 1px solid #ccc;
}



#archive-journal h1{
margin: 0 0 0 0;
padding: 0 0 10px 0;

/*FONT 375px計算*/
font-size: 18px;
font-size: 4.8vw;
font-size: clamp(17px, 4.8vw, 19.0px);


/*Neue Haas Grotesk Display Pro Light*/
font-family: "neue-haas-grotesk-display", sans-serif;
font-weight: 400;
font-style: normal;

line-height: 1.5;
letter-spacing: 0.03em;
}





#archive-journal .kaku_kiji{
position: relative;
width: 100%;
margin: 0;
padding: 15px 0 15px 0;


border-bottom: 1px solid #ccc;
}


#archive-journal .kaku_kiji a{
position: absolute;
z-index: 2;
top: 0;
left: 0;
width: 100%;
height: 100%;
cursor: pointer;
}


/*日付*/
#archive-journal .kaku_kiji .date_area{
width: 100%;
margin: 0 0 0 0;
padding: 0 0 10px 0;

/*FONT 375px計算*/
font-size: 9px;
}


/*日付*/
#archive-journal .kaku_kiji .title_area{
width: 100%;
margin: 0 0 0 0;
padding: 0 0 0 0;

/*FONT 375px計算*/
font-size: 11px;
font-size: 2.9333333vw;
font-size: clamp(10px, 2.9333333vw, 12.0px);
}








/*スマホ終了
--------------------------------------------------------------------------------------------------------------------------------------------------------------------*/
@media screen and (min-width: 768px) {




#archive-journal{
width: 85%;
margin: 150px auto 120px auto;
padding: 0 0 0 0;
}


#archive-journal h1{
margin: 0 0 0 0;
padding: 0 0 100px 0;

/*Neue Haas Grotesk Display Pro Light*/
font-family: "neue-haas-grotesk-display", sans-serif;
font-weight: 400;
font-style: normal;

font-size: 21px;
line-height: 1.5;
letter-spacing: 0.03em;
}



#archive-journal .layout_kaku_kiji{
width: 100%;
margin: 0 auto 0 auto;
padding: 0 0 0 0;
border-top: 1px solid #ccc;
}



#archive-journal .kaku_kiji{
position: relative;
width: 100%;
margin: 0;
padding: 15px 0 15px 0;
border-bottom: 1px solid #ccc;

/*全体 子要素を折り返しせず、1行に配置*/
display: -webkit-flex;
display: flex;
flex-wrap: nowrap;
/*横並び・右から左*/
flex-direction: row-reverse;
}



/*日付*/
#archive-journal .kaku_kiji .date_area{
flex-basis: 110px;
margin: 0 0 0 0;
padding: 0 0 0 60px;

font-size: 12px;
text-align: right;
}


#archive-journal .kaku_kiji .date_area span{
margin: 0 20px 0 0;
}

/*日付*/
#archive-journal .kaku_kiji .title_area{
margin: 0 0 0 0;
padding: 0 0 0 0;

flex-basis: calc( 100% - 170px );
flex-basis: -webkit-calc( 100% - 170px );

font-size: 14px;
}

#archive-journal .kaku_kiji .title_area span{
margin: 0 0 0 20px;
}


#archive-journal .kaku_kiji a{
position: absolute;
z-index: 2;
top: 0;
left: 0;
width: 100%;
height: 100%;
cursor: pointer;
}



}/*タブレット以上向け終了括弧*/