@charset "utf-8";
/* お知らせ一覧 */

.g_navi_menu .gnav01 a::after {
opacity: 1;
}

/*-------------------------------------------------
タブメニュー
-------------------------------------------------*/

.tabs {
display: flex;
justify-content: space-between;
}
.tabs_menu {
width: 20%;
display: flex;
flex-direction: column;
}
.tabs_menu-item {
padding: 18px 10px 18px 25px;
font-size: 1.4rem;
font-weight: 500;
line-height: 100%;
letter-spacing: 0.1em;
color: #999;
cursor: pointer;
transition: ease 0.5s;
position: relative;
}
.tabs_menu-item:hover {
color: #000;
transform: ease 0.5s;
}
.tabs_menu-item:hover::before {
content: "";
transition: ease 0.5s;
position: absolute;
top: 50%;
left: 0;
width: 9px;
height: 9px;
background: #D13239;
border-radius: 50%;
transform: translate(50%, -50%);
}
.tabs_menu-item.is-active {
color: #000;
cursor: default;
}
.tabs_menu-item.is-active::before {
content: "";
transition: ease 0.3s;
position: absolute;
top: 50%;
left: 0;
width: 9px;
height: 9px;
background: #D13239;
border-radius: 50%;
transform: translate(50%, -50%);
}
.tabs_contain {
width: 78%;
}
.tabs_body {
display: none;
}
.tabs_body.is-active {
display: block;
}
.tab_inner {
opacity: 0;
animation: fadeIn 1.0s forwards;
}

@keyframes fadeIn {
0% { opacity: 0;}
100% { opacity: 1;}
}

.tab_menu_title {
font-size: 3.0rem;
font-weight: 400;
line-height: 100%;
letter-spacing: 0.2em;
padding-left: 45px;
position: relative;
margin-bottom: 50px;
}
.tab_menu_title::before {
content: "";
display: inline-block;
background-color: #000;
width: 30px;
height: 2px;
position: absolute;
left: 0;
top: 50%;
}

/*-------------------------------------------------
ニュース記事一覧
-------------------------------------------------*/

.news_box {
width: 100%;
padding: 25px 20px 25px 20px;
border-bottom: dotted 1px #ccc;
}
.head_box {
display: flex;
align-items: center;
margin-bottom: 15px;
}
.head_box .date {
font-family: "Oswald", serif;
font-weight: 400;
color: #000;
letter-spacing: 0.1em;
font-size: 1.2rem;
line-height: 100%;
margin-right: 15px;
display: inline-block;
}
.subcategory {
font-size: 1.2rem;
font-weight: 400;
letter-spacing: 0.05em;
line-height: 100%;
padding: 5px 10px;
border: solid 1px #8E6C47;
color: #8E6C47;
display: inline-block;
}
.new_icon {
font-family: "Oswald", serif;
font-weight: 300;
font-size: 1.1rem;
padding: 5px 13px;
color: #fff;
background: #272A2F;
margin-left: 10px;
line-height: 100%;
text-align: center;
display: block;
}
.news_title a {
font-size: 1.5rem;
font-weight: 500;
letter-spacing: 0.2em;
max-width: 890px;
width: 100%;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 1;
overflow: hidden;
text-overflow: ellipsis;
}
.news_title a:hover {
text-decoration: underline;
}


/* お知らせ一覧 スマートフォン
-------------------------------------------------- */

@media all and (max-width : 767px ){
.tabs {
flex-direction: column;
}
.tabs_menu {
width: 100%;
display: flex;
flex-direction: row;
flex-wrap: wrap;
justify-content: center;
margin-bottom: 30px;
}
.tabs_menu-item {
padding: 10px 10px 10px 18px;
font-size: 1.1rem;
}
.tabs_menu-item.is-active::before {
width: 8px;
height: 8px;
}
.tabs_contain {
width: 100%;
}
.tab_menu_title {
font-size: 1.6rem;
font-weight: 500;
letter-spacing: 0.1em;
padding-left: 23px;
margin-bottom: 15px;
}
.tab_menu_title::before {
width: 17px;
height: 1px;
}

.news_box {
padding: 15px 10px 15px 10px;
}
.head_box {
margin-bottom: 10px;
}
.head_box .date {
font-size: 1.0rem;
margin-right: 10px;
}
.subcategory {
font-size: 1.0rem;
padding: 4px 10px;
}
.new_icon {
font-size: 1.0rem;
padding: 4px 11px;
}
.news_title a {
font-size: 1.2rem;
}
}


/* お知らせ詳細ページ
-------------------------------------------------- */

.article_wrap {
display: flex;
justify-content: space-between;
}
.side_navi {
width: 20%;
}
.article_box {
width: 78%;
}
.news_menu {
display: flex;
flex-direction: column;
}
.news_menu li {
padding: 18px 10px 18px 25px;
font-size: 1.4rem;
font-weight: 500;
line-height: 100%;
letter-spacing: 0.1em;
color: #999;
position: relative;
}
.news_menu li a {
transition: ease 0.5s;
}
.news_menu li a:hover {
color: #000;
transform: ease 0.5s;
}
.news_menu li a:hover::before {
content: "";
transition: ease 0.5s;
position: absolute;
top: 50%;
left: 0;
width: 9px;
height: 9px;
background: #D13239;
border-radius: 50%;
transform: translate(50%, -50%);
}
.article_title {
font-size: 3.0rem;
font-weight: 400;
padding: 0 10px 15px 0;
border-bottom: dotted 1px #ccc;
letter-spacing: 0.15em;
margin-bottom: 30px;
}

@media all and (max-width : 1260px ){
.article_title {
font-size: 2.6rem;
}
}

@media all and (max-width : 1024px ){
.article_title {
font-size: 2.2rem;
}
}

@media all and (max-width : 820px ){
.article_title {
font-size: 2.0rem;
}
}

@media all and (max-width : 767px ){
.article_title {
font-size: 1.5rem;
margin-bottom: 15px;
}
}

#page_news_dtl .breadcrumb li:last-child {
max-width: 540px;
width: 100%;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 1;
overflow: hidden;
text-overflow: ellipsis;
}
#page_news_dtl .article_box p {
line-height: 200%;
font-size: 1.5rem;
display: block;
padding: 0px 10px 15px 0;
}
#page_news_dtl .article_box p a {
text-decoration: underline;
color: #8E7742;
}
#page_news_dtl .article_box p a:hover {
text-decoration: none;
}
#page_news_dtl .article_box img {
margin: 20px auto;
}
#page_news_dtl .link_btn_box {
margin-top: 50px;
}

/* お知らせ詳細　スマートフォン
-------------------------------------------------- */

@media all and (max-width : 767px ){
.article_wrap {
display: flex;
flex-direction: column-reverse;
justify-content: flex-start;
}
.side_navi {
display: none;
}
.article_box {
width: 100%;
}
.news_menu {
display: flex;
flex-direction: row;
flex-wrap: wrap;
}
#page_news_dtl .breadcrumb li:last-child {
max-width: 250px;
}
#page_news_dtl .article_box p {
line-height: 160%;
font-size: 1.2rem;
padding: 0px 10px 15px 0;
}
#page_news_dtl .article_box p a:hover {
text-decoration: none;
}
#page_news_dtl .link_btn_box {
margin-top: 20px;
margin-bottom: 10px;
}
}