/* ----------------------------------------------------------   

   .block_works_archive

   ---------------------------------------------------------- */

.block_works_archive { margin-top: 90px; padding: 0 6.5% 150px;}

@media screen and (max-width: 960px) {
.block_works_archive { margin-top: 80px; padding: 0 6.5% 120px;}  
}
@media screen and (max-width: 738px) {
.block_works_archive { margin-top: 70px; padding: 0 5% 100px;}
}
@media screen and (max-width: 640px) {
.block_works_archive { margin-top: 60px;}
}





/* ----------------------------------------------------------   

   .block_journal_post

   ---------------------------------------------------------- */

.block_works_post {margin-top: 90px; padding: 0 6.5% 150px;}

@media screen and (max-width: 960px) {
.block_works_post { margin-top: 80px; padding: 0 6.5% 120px;}  
}
@media screen and (max-width: 738px) {
.block_works_post { margin-top: 70px; padding: 0 0 100px;}
}
@media screen and (max-width: 640px) {
.block_works_post { margin-top: 60px;}
}


/* -----  .head_area ----- */ 
.block_works_post .head_area { position: relative; z-index: 0;}

/* .txt_area */
.block_works_post .head_area .txt_area { width:80%; max-width: 850px; margin:90px auto 0; }

/* .title_area */
/* ul.category */
.block_works_post .head_area ul.list_cat { list-style: none; display: flex; flex-wrap: wrap; gap:0 15px;}
.block_works_post .head_area ul.list_cat li { position: relative; z-index: 0; }
.block_works_post .head_area ul.list_cat li a { display: block; font-size: 14px;font-family: 'apercu-light-pro'; font-weight: normal; line-height: 1.5; letter-spacing: 0.05em; position: relative; z-index: 0;}
.block_works_post .head_area ul.list_cat li a:after { position: absolute; bottom: 0; left: 0; right: 0; height: 0; content: ""; border-bottom: #779fa6 1px solid; z-index: 0;}

@media (hover: hover) {
.block_works_post .head_area ul.list_cat li a:hover {color: #779fa6;}    
}

/* .t_ttl_post */
.block_works_post .head_area .t_ttl_works { margin-top: 20px; font-size: 45px; font-weight: 450; letter-spacing: 0.05em; line-height: 1.65;}
.block_works_post .head_area .t_type { margin-top: 10px; font-size: 16px; font-weight: 400; letter-spacing: 0.075em; line-height: 1.7;}
.block_works_post .head_area .t_year { margin-top: 20px; font-size: 14px; font-family: 'apercu-regular-pro'; font-weight: normal;line-height: 25px; letter-spacing: 0.1em; }

/* .description_area */
.block_works_post .head_area .description_area { margin: 35px 0 0;}

/* .section_area */
.block_works_post .head_area .section_area { margin: 35px 0 0;}
.block_works_post dl.dl_section { font-size: 15px; font-weight: 380; line-height: 1.8; letter-spacing: 0.075em;}
.block_works_post dl.dl_section div+div {margin-top: 30px; }
.block_works_post dl.dl_section dt { display: block; font-size: 14px; font-family: 'apercu-regular-pro'; line-height: 1; }
.block_works_post dl.dl_section dd { margin-top: 5px; }
.block_works_post dl.dl_section dd a {border-bottom: #779fa6 1px solid; }

@media (hover: hover) {
.block_works_post dl.dl_section dd a:hover {color: #779fa6;}
}

@media screen and (max-width: 960px) {
.block_works_post .head_area .txt_area { width:100%; max-width: 100%; margin: 60px 0 0; padding: 0 5%; }
.block_works_post .head_area ul.list_cat { gap:0 12px;}
.block_works_post .head_area ul.list_cat li a { font-size: 14px;}
.block_works_post .head_area .t_ttl_works { margin-top: 15px; font-size: 40px; line-height: 1.7;}
.block_works_post .head_area .t_type { margin-top: 5px; font-size: 16px; font-weight: 400; letter-spacing: 0.075em; line-height: 1.7;}
.block_works_post .head_area .t_year { margin-top: 20px; font-size: 14px; line-height: 1; letter-spacing: 0.075em; }    
}
@media screen and (max-width:738px) {
.block_works_post .head_area .txt_area { margin: 50px 0 0; }
.block_works_post .head_area ul.list_cat { gap:0 10px;}
.block_works_post .head_area ul.list_cat li a { font-size: 13px;}
.block_works_post .head_area .t_ttl_works { margin-top: 15px; font-size: 30px; line-height: 1.7;}
.block_works_post .head_area .t_type { margin-top: 5px; font-size: 14px; letter-spacing: 0.075em; line-height: 1.7;}
.block_works_post .head_area .t_year { margin-top: 20px; font-size: 13px; }  
}
@media screen and (max-width:640px) {
.block_works_post .head_area .txt_area { margin: 50px 0 0; }
.block_works_post .head_area .t_ttl_works { font-size: 20px; line-height: 1.7;}
}


/* -----  .post_list ----- */ 
.block_works_post .post_area { margin: 100px 0 0; padding: 0 7.5%;}

.block_works_post .list_post {display: flex; flex-wrap: wrap; justify-content: space-between; gap:80px 0;}
.block_works_post .list_post img {width: 100%; border: #f2f2f2 1px solid; }
.block_works_post .list_post img.post_half { width: 46.5%;}

@media screen and (max-width: 960px) {
.block_works_post .post_area { margin: 90px 0 0; padding: 0;}
.block_works_post .list_post { gap:70px 0;}
.block_works_post .list_post img.post_half { width: 46.5%;}
}
@media screen and (max-width: 738px) {
.block_works_post .post_area { margin: 70px 0 0; padding: 0 5%;}
.block_works_post .list_post { gap:60px 0;}
.block_works_post .list_post img.post_half { width: 47.5%;}    
}





/* ----------------------------------------------------------   

  .block_journal_related

   ---------------------------------------------------------- */

.block_works_other { padding: 150px 6.5%; border-top: #111 1px solid; position: relative; z-index: 0; }
.block_works_other:before { position: absolute; top: -1px; left: 13%; right:13%; height: 0; content: ""; border-top: #ddd 1px solid; z-index: 2;}
.block_works_other:after { position: absolute; top: -1px; left: 6.5%; right: 6.5%; height: 0; content: ""; border-top: #fafafa 1px solid; z-index: 1;}

@media screen and (max-width: 960px) {
.block_works_other { padding: 120px 6.5%; }
}
@media screen and (max-width: 738px) {
.block_works_other { padding: 100px 5%; }
.block_works_other:before { left: 10%; right:10%; }
.block_works_other:after { left: 5%; right: 5%;}
}

.block_works_other .headline {text-align: center;}












/* .post_list_works .txt_area  */
#works_detail .head_area .title_area h1.title {margin:10px 0 0; padding: 0; font-size: 40px;font-family: 'apercu-regular-pro';font-weight: normal;line-height: 1.2; letter-spacing: 0.05em; }
#works_detail .head_area .title_area h2.type {margin-top:8px; font-size: 15px;font-family: 'Noto Sans JP', sans-serif; font-weight: normal; letter-spacing: 0.15em; line-height: 1.7; }
#works_detail .head_area .title_area .year { margin-top: 12px; font-size: 14px; font-family: 'apercu-light-pro'; font-weight: normal;line-height: 25px; letter-spacing: 0.1em; }

@media screen and (max-width: 900px) {
#works_detail .head_area .title_area h1.title {margin:10px 0 0; font-size: 30px;line-height: 1.3;}
#works_detail .head_area .title_area h2.type {margin-top:8px; font-size: 14px;}
#works_detail .head_area .title_area .year { margin-top: 10px; font-size: 13px; }
}
@media screen and (max-width: 738px) {
#works_detail .head_area .title_area h1.title {margin:10px 0 0; font-size: 20px;line-height: 1.3;}
#works_detail .head_area .title_area h2.type {margin-top:6px; font-size: 13px;}
#works_detail .head_area .title_area .year { margin-top: 8px; font-size: 12px; }
}


/* .description_area */
#works_detail .head_area .description_area { margin: 35px 0 0;}


/* .section_area */
#works_detail .head_area .section_area { margin: 35px 0 0;}
#works_detail .head_area .section_area dl { margin-top: 20px; font-size: 14px; font-weight: normal; line-height: 1.9; letter-spacing: 0.05em;}
#works_detail .head_area .section_area dl dt { display: block; font-family: 'apercu-light-pro'; line-height: 1; }
#works_detail .head_area .section_area dl dd { margin-top: 10px; font-family: 'apercu-regular-pro','Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', Meiryo;}
#works_detail .head_area .section_area dl dd a {border-bottom: #779fa6 1px solid; }
#works_detail .head_area .section_area dl dd a:hover {color: #779fa6;}

@media screen and (max-width: 900px) {
#works_detail .head_area .section_area dl dd a:hover {color: #111;}
}
@media screen and (max-width: 738px) {
#works_detail .head_area .section_area dl {  font-size: 13px; line-height: 1.8;}
#works_detail .head_area .section_area dl dd { margin-top: 8px; }
}












/* ----------------------------------------------------------   

  #works_detail

   ---------------------------------------------------------- */

#works_detail { margin-top:70px;  padding: 0 7.5%; overflow: hidden;}

@media screen and (max-width: 900px) {
#works_detail { margin-top: 60px; padding: 0 7.5%; padding: 0; }
}
@media screen and (max-width: 738px) {
#works_detail { margin-top: 50px; padding: 0 5%; padding: 0; }
}


/* -----  .head_area ----- */ 
#works_detail .head_area { position: relative; z-index: 0;}

/* .img_area */
#works_detail .head_area .img_area { width: 90%;}

@media screen and (max-width: 900px) {
#works_detail .head_area .img_area { width: 100%;}
}


/* .txt_area */
#works_detail .head_area .txt_area { float: left; width:70%; margin:90px 0 0 15%; }

@media screen and (max-width: 900px) {
#works_detail .head_area .txt_area { float: none; width:100%; max-width: 700px; margin:50px auto 0;  padding: 0 7.5%;}
}
@media screen and (max-width:738px) {
#works_detail .head_area .txt_area { margin:35px auto 0; }
}

/* .title_area */
#works_detail .head_area .title_area {}
/* ul.category */
#works_detail .head_area .title_area ul.category { font-size: 0; margin: 0 -8px;}
#works_detail .head_area .title_area ul.category li { display: inline-block; margin: 0 8px; position: relative; z-index: 0; }
#works_detail .head_area .title_area ul.category li:last-child:after { display: none;}
#works_detail .head_area .title_area ul.category li a { display: block; font-size: 14px;font-family: 'apercu-light-pro'; font-weight: normal; line-height: 20px; letter-spacing: 0.1em; position: relative; z-index: 0;}
#works_detail .head_area .title_area ul.category li a:after { position: absolute; bottom: 0; left: 0; right: 0; height: 0; content: ""; border-bottom: #779fa6 1px solid; z-index: 0;}
#works_detail .head_area .title_area ul.category li a:hover {color: #779fa6;}





/* .post_list_works .txt_area  */
#works_detail .head_area .title_area h1.title {margin:10px 0 0; padding: 0; font-size: 40px;font-family: 'apercu-regular-pro';font-weight: normal;line-height: 1.2; letter-spacing: 0.05em; }
#works_detail .head_area .title_area h2.type {margin-top:8px; font-size: 15px;font-family: 'Noto Sans JP', sans-serif; font-weight: normal; letter-spacing: 0.15em; line-height: 1.7; }
#works_detail .head_area .title_area .year { margin-top: 12px; font-size: 14px; font-family: 'apercu-light-pro'; font-weight: normal;line-height: 25px; letter-spacing: 0.1em; }

@media screen and (max-width: 900px) {
#works_detail .head_area .title_area h1.title {margin:10px 0 0; font-size: 30px;line-height: 1.3;}
#works_detail .head_area .title_area h2.type {margin-top:8px; font-size: 14px;}
#works_detail .head_area .title_area .year { margin-top: 10px; font-size: 13px; }
}
@media screen and (max-width: 738px) {
#works_detail .head_area .title_area h1.title {margin:10px 0 0; font-size: 20px;line-height: 1.3;}
#works_detail .head_area .title_area h2.type {margin-top:6px; font-size: 13px;}
#works_detail .head_area .title_area .year { margin-top: 8px; font-size: 12px; }
}


/* .description_area */
#works_detail .head_area .description_area { margin: 35px 0 0;}


/* .section_area */
#works_detail .head_area .section_area { margin: 35px 0 0;}
#works_detail .head_area .section_area dl { margin-top: 20px; font-size: 14px; font-weight: normal; line-height: 1.9; letter-spacing: 0.05em;}
#works_detail .head_area .section_area dl dt { display: block; font-family: 'apercu-light-pro'; line-height: 1; }
#works_detail .head_area .section_area dl dd { margin-top: 10px; font-family: 'apercu-regular-pro','Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', Meiryo;}
#works_detail .head_area .section_area dl dd a {border-bottom: #779fa6 1px solid; }
#works_detail .head_area .section_area dl dd a:hover {color: #779fa6;}

@media screen and (max-width: 900px) {
#works_detail .head_area .section_area dl dd a:hover {color: #111;}
}
@media screen and (max-width: 738px) {
#works_detail .head_area .section_area dl {  font-size: 13px; line-height: 1.8;}
#works_detail .head_area .section_area dl dd { margin-top: 8px; }
}



.youtube {
position: relative;
padding-bottom: 56.25%;
padding-top: 30px;
height: 0;
overflow: hidden;
}
.youtube iframe,
.youtube object,
.youtube embed {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}





/* -----  .post_list ----- */ 
#works_detail .post_list { margin:45px -3.5% -45px; font-size: 0; padding: 0 7.5%; }

#works_detail .post_list img.post {display: inline-block; width: 93%; margin: 45px 3.5%; border: #f2f2f2 1px solid; }
#works_detail .post_list img.post_half { width: 43%;}

@media screen and (max-width: 900px) {
#works_detail .post_list { margin:35px -3.5% -35px; padding: 0 7.5%; }
#works_detail .post_list img.post { margin: 35px 3.5%;}
}
@media screen and (max-width: 738px) {
#works_detail .post_list { margin:60px 0 0; padding: 0 5%; }
#works_detail .post_list img.post,
#works_detail .post_list img.post_half { display: block; width: 100%; margin: 40px 0 0; }
}





/* ----- .page-prev-next  ----- */
.page-prev-next { margin-top: 120px; position: relative; z-index: 0;}
.page-prev-next .page-box {  float: right; width: 47.5%; text-align:right; position: relative; z-index: 0;}
.page-prev-next .next-box { float: left; text-align: left;}
.page-prev-next .page-box a { display: inline-block; font-size: 20px; font-family: 'apercu-regular-pro';font-weight: normal;letter-spacing: 0.15em;text-align: center;  line-height: 30px; position: relative; z-index: 1; text-transform: uppercase;}
.page-prev-next .page-box a:before  { position: absolute; top: 0; bottom: 0; width: auto; height: 30px; margin: auto 0; font-size: 0.85em; font-family:themify; font-weight: normal;z-index: 0;-webkit-transition: all 0.2s ease;transition: all 0.2s ease;}
.page-prev-next .page-box a:after { position: absolute; bottom: 0; right: 0; left: 0; height: 0; content: ""; border-bottom: #fafafa 1px solid; z-index: 0;-webkit-transition: all 0.2s ease;transition: all 0.2s ease;}
.page-prev-next .prev-box a { padding-right: 35px;}
.page-prev-next .prev-box a:before  { right: 0;content: "\e628";}
.page-prev-next .prev-box a:after { right: 0;}
.page-prev-next .next-box a { padding-left: 35px;}
.page-prev-next .next-box a:before  { left: 0;content:"\e629"}
.page-prev-next .next-box a:after { right: 0;}
.page-prev-next .page-box a:hover:after { border-color: #111;}


@media only screen and (max-width: 900px) {
.page-prev-next { margin-top: 80px; }
.page-prev-next .page-box a { font-size: 18px;letter-spacing: 0.1em;}
.page-prev-next .prev-box a { padding-right: 30px;}
.page-prev-next .next-box a { padding-left: 30px;}
.page-prev-next .page-box a:hover:after { border-color: #fafafa;}
}
@media only screen and (max-width: 738px) {
.page-prev-next { margin-top: 65px; padding: 0 5%;}
.page-prev-next .page-box a:before  { position: absolute; top: -3px; }
}





/* ----------------------------------------------------------   

  #works_other

   ---------------------------------------------------------- */

#works_other { margin-top: 140px; padding: 140px 7.5% 0;border-top: #111 1px solid; position: relative; z-index: 0; }
#works_other:before { position: absolute; top: -1px; left: 12.5%; right:12.5%; height: 0; content: ""; border-top: #ddd 1px solid; z-index: 2;}
#works_other:after { position: absolute; top: -1px; left: 7.5%; right: 7.5%; height: 0; content: ""; border-top: #fafafa 1px solid; z-index: 1;}

@media screen and (max-width: 900px) {
#works_other { margin-top: 120px; padding: 120px 7.5% 0; }
}
@media screen and (max-width: 738px) {
#works_other { margin-top: 100px; padding: 100px 5% 0; }
}



/* ----- .post_list ----- */
.post_list_works { margin: -45px; font-size: 0; text-align: left }
.post_list_works .post {display: inline-block; width: 33.333%; border:transparent 45px solid; vertical-align: middle;}

@media screen and (max-width: 900px) {
.post_list_works{ margin: -35px; font-size: 0;  }
.post_list_works .post { width: 50%; border:transparent 35px solid;}
}
@media screen and (max-width: 738px) {
.post_list_works { margin: -20px -15px; font-size: 0;  }
.post_list_works .post { width: 50%; border-width: 20px 15px;vertical-align: top;}
}



/* .img_area */
.post_list_works .img_area {height: auto;position: relative; z-index: 0; }
.post_list_works .img_area a img {-webkit-transition: all 0.5s ease;transition: all 0.5s ease;}
.post_list_works .img_area a:hover img {-webkit-transform: scale(0.975,0.975);transform: scale(0.975,0.975);}

@media screen and (max-width: 900px) {
.post_list_works .img_area a:hover img {-webkit-transform: scale(1,1);transform: scale(1,1);}
}



/* .txt_area */
.post_list_works .txt_area {margin-top: 20px; text-align: left;}
.post_list_works .txt_area{ margin-top: 20px;}

@media screen and (max-width: 738px) {
.post_list_works .txt_area{ margin-top: 15px;}
}


/* ul.category */
.post_list_works .txt_area ul.category { font-size: 0; margin: 0 -6px;}
.post_list_works .txt_area ul.category li { display: inline-block; margin: 0 6px; position: relative; z-index: 0; }
.post_list_works .txt_area ul.category li:last-child:after { display: none;}
.post_list_works .txt_area ul.category li a { display: block; font-size: 12px;font-family: 'apercu-light-pro'; font-weight: normal; line-height: 20px; letter-spacing: 0.1em; position: relative; z-index: 0;}
.post_list_works .txt_area ul.category li a:after { position: absolute; bottom: 0; left: 0; right: 0; height: 0; content: ""; border-bottom: #779fa6 1px solid; z-index: 0;}
.post_list_works .txt_area ul.category li a:hover {color: #779fa6;}

@media screen and (max-width: 900px) {
.post_list_works .txt_area ul.category li a:hover {color: #111;}
}
@media screen and (max-width: 738px) {
.post_list_works .txt_area ul.category { margin: 0 -5px;}
.post_list_works .txt_area ul.category li { margin: 0 5px; }
.post_list_works .txt_area ul.category li a {  font-size: 11px;}
}
@media screen and (max-width: 414px) {
.post_list_works .txt_area ul.category li a {  font-size: 10px; line-height: 15px;}
}



/* .post_list_works .txt_area  */
.post_list_works .txt_area h1.title {margin:5px 0 0; padding: 0; font-size: 20px;font-family: 'apercu-regular-pro';font-weight: normal;line-height: 1.3; letter-spacing: 0.02em; position: relative; z-index: 1;}
.post_list_works .txt_area h1.title a{border-bottom: transparent 1px solid;}
.post_list_works .txt_area h1.title a:hover { border-color: #111;}
.post_list_works .txt_area h2.type {margin-top:5px; font-size: 12px;font-family: 'Noto Sans JP', sans-serif; font-weight: normal; letter-spacing: 0.15em; line-height: 1.7;  position: relative; z-index: 1;}

@media screen and (max-width: 900px) {
.post_list_works .txt_area h1.title{ font-size: 18px;}
.post_list_works .txt_area h1.title a:hover:hover { border-color: transparent ;}
}
@media screen and (max-width: 738px) {
.post_list_works .txt_area h1.title{ margin-top: 3px; font-size: 16px;}
.post_list_works .txt_area h2.type {margin-top:3px; font-size: 12px;}
}
@media screen and (max-width: 414px) {
.post_list_works .txt_area h1.title{ margin-top:-5px; }
.post_list_works .txt_area h2.type {margin-top:3px; font-size: 11px; letter-spacing: 0.1em;}
}


.post_list_works .txt_area .year { margin-top: 10px; font-size: 13px; font-family: 'apercu-light-pro'; font-weight: normal;line-height: 25px; letter-spacing: 0.1em; }

@media screen and (max-width: 738px) {
.post_list_works .txt_area .year { margin-top: 5px; font-size: 11px; }
}