/* CSS Document */

@import url('https://fonts.googleapis.com/css2?family=Abril+Fatface&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Noto+Serif+JP:wght@200;300;400;500;600;700;900&display=swap');

/* 共通 */
#Wrap {width: 100%; margin: 0 auto;}
.clearfix {display: block;}
.ContentsBody-full { width: 100%;  margin: 0 auto; padding-bottom: 50px;}
.ContentsBody-limit { max-width: 1000px;  margin: 0 auto; padding-bottom: 20px;}
.WNP .title { }
.WNP .title h1 { font-size: 35px; padding: 100px 0 50px 0;font-family: "Abril Fatface","Noto Serif JP",serif,cursive;font-weight: 400 !important;text-align: center;}
.WNP h2 {font-size: 2.3em;}
.WNP h3 {font-size: 2em;}
.WNP h4 {font-size: 1.75em;}
.WNP h5 {font-size: 1.5em;}
.WNP p {font-size: 14px;}

/* 追加ブログ*/
.blg_text {font-weight: bold !important; font-size: 13px;letter-spacing: 2px;line-height: 26px;}

@media screen and (max-width:768px) {
	.blg_text {font-weight: bold !important; font-size: 11px;letter-spacing: 1px;line-height: 22px;}
	.WNP h2 {font-size: 1.8em;}
	
	.WNP .title h1 { font-size: 20px !important; padding: 100px 0 100px 0;font-family: "Abril Fatface","Noto Serif JP",serif,cursive;font-weight: 400 !important;text-align: center;}
	
}

/* 追加ワークス */

.font_fat {font-family: 'Abril Fatface', cursive;}
.font_noto {font-family: 'Noto Serif JP', serif;}
.font_wks {font-family: "Abril Fatface","Noto Serif JP",serif,cursive;font-weight: 400 !important;}

.wks_firsttext {text-align: center; font-weight: bold; font-size: 13px;letter-spacing: 2px;line-height: 24px;}

.wks_title {text-align: center; font-size: 30px;line-height: 50px; padding: 50px 0 38px 0;}
.wks_title span {font-size: 26px;font-weight: 600 !important;}
.wks_title_text {text-align: center; font-weight: bold; font-size: 13px;letter-spacing: 2px;line-height: 24px;}

.wks_g_text {text-align: center; font-weight: bold; font-size: 13px;letter-spacing: 2px;line-height: 24px;padding: 20px 0;}
.wks_gly_bg {padding: 50px 0 20px 0;}



.wks_s_waku {text-align: center;}
.wks_n_title {font-size: 20px;line-height: 36px; padding: 5px 0 15px 0;font-weight: bold;color: #908E83;}
.wks_n_text {font-weight: bold !important; font-size: 14px;letter-spacing: 2px;line-height: 30px;}


/* 追加お知らせ */

.fr_firsttext {text-align: center; font-weight: bold; font-size: 13px;letter-spacing: 2px;line-height: 24px;}

.fr_tkt_area {text-align: center;padding: 0;margin: 80px 0 100px 0;}
.fr_tkt_title {font-size: 18px;line-height: 36px; padding: 0px 0 30px 0;font-weight: bold;}
.fr_tkt_textarea {padding: 30px;margin: 0 150px;background-color: #fff;font-weight: bold; font-size: 13px;letter-spacing: 2px;line-height: 24px;}

.fr_title_top {text-align: center; font-size: 30px;line-height: 50px; padding: 50px 0 38px 0;margin: 0 0 50px 0; border-bottom: 1px solid #dbdbdb; color: #908E83;}
.fr_title_top span {font-size: 26px;font-weight: 600 !important;}

.fr_title {text-align: center; font-size: 30px;line-height: 50px; padding: 50px 0 38px 0;}
.fr_title span {font-size: 26px;font-weight: 600 !important;}

.fr_title_text {text-align: center; font-weight: bold; font-size: 13px;letter-spacing: 2px;line-height: 24px;}
.fr_gly_bg {padding:50px 0 20px 0;}


/* ２カラム */

.fr_tc_title {text-align: left; font-size: 20px;line-height: 36px; padding: 5px 0 15px 0;font-weight: bold;color: #908E83;}

.fr_tc_title_text {text-align: left; font-weight: bold; font-size: 13px;letter-spacing: 2px;line-height: 26px;}



@media screen and (max-width:768px) {
	.wks_firsttext {text-align: center; font-weight: bold; font-size: 11px;letter-spacing: 1px;line-height: 22px;}
	.wks_title {text-align: center; font-size: 30px;line-height: 35px;  padding: 50px 0 25px 0;}
	.wks_title span {font-size: 23px;font-weight: 500 !important;}
	.wks_title_text {text-align: center; font-weight: bold; font-size: 11px;letter-spacing: 1px;line-height: 22px;}

	.wks_g_text {text-align: center; font-weight: bold; font-size: 11px;letter-spacing: 1px;line-height: 22px;padding: 20px;}
	.wks_gly_bg {padding:50px 0 20px 0;}
	
	.wks_s_waku {text-align: center;}
	.wks_n_title {font-size: 18px;line-height: 32px; padding: 5px 0 15px 0;font-weight: bold;color: #908E83;}
	.wks_n_text {font-weight: bold !important; font-size: 12px;letter-spacing: 2px;line-height: 24px;}
	
/* 追加お知らせ */

	.fr_firsttext {text-align: center; font-weight: bold; font-size: 11px;letter-spacing: 1px;line-height: 22px;}

	.fr_tkt_area {text-align: center;padding: 0;margin: 40px 0 50px 0;}
	.fr_tkt_title {font-size: 18px;line-height: 36px; padding: 0px 0 30px 0;font-weight: bold;}
	.fr_tkt_textarea {padding: 10px 5px;margin: 0 5px;background-color: #fff;font-weight: bold; font-size: 12px;letter-spacing: 1px;line-height: 22px;}

	.fr_title_top {text-align: center; font-size: 30px;line-height: 35px; padding: 38px 0;}
	.fr_title_top span {font-size: 23px;font-weight: 500 !important;}
	
	.fr_title {text-align: center; font-size: 30px;line-height: 35px; padding: 38px 0;}
	.fr_title span {font-size: 23px;font-weight: 500 !important;}
	
	.fr_title_text {text-align: center; font-weight: bold; font-size: 11px;letter-spacing: 1px;line-height: 22px;}
	.fr_gly_bg {padding:0;}
	
	
	.fr_tc_title_text {font-weight: bold !important; font-size: 11px;letter-spacing: 1px;line-height: 22px;}
}



@media screen and (max-width:768px) {
	.ContentsBody-limit { max-width: 90%; padding-bottom: 20px;}
	.WNP .title h1 { font-size: 30px; padding: 50px 0;font-family: "Abril Fatface","Noto Serif JP",serif,cursive;font-weight: 400 !important;text-align: center;}
}

/* works */
.bg-beige {background-color: #EFEDE8;}

/* works-top */
.worksList .wrappadding { padding: 40px 0 50px; }
.worksList .contents-body { display: flex; flex-wrap: wrap; justify-content: space-between; }
.worksList .works-post { width: 32%; background: #fff; margin-bottom: 20px; }
.worksList .works-post:nth-child(3n+2):last-child { margin-left:auto; margin-right:34%; }
.worksList a.item {display: block; padding: 6.25%;}
.worksList .works-cat { display: block; width: 50%; margin:20px auto 0; padding: 0.3em; text-align: center; border-top: 1px solid #BA963B; border-bottom: 1px solid #BA963B;}
.worksList h4 { font-size:16px; font-weight: 600; text-align: center; width: 100%; margin: 20px auto 0; padding: 0; }
.worksList .excerpt { font-size: 14px; margin: 15px auto 0; padding: 0; }

.worksList a{display: block;height: 100%; padding: 0 0 15px;}
.worksList a:hover{opacity: 0.8;}
.worksList_img{width: 100%; height: 210px;object-fit:cover;overflow: hidden;}
.worksList_more a{display: block; border: 1px solid #555; text-align: center;padding: 10px 0;font-size:14px; width: 220px;margin: 20px auto 0;}

@media screen and (max-width:1000px) {
	.worksList .wrappadding { padding: 0 20px; }
}
@media screen and (max-width:768px) {
	.worksList .wrappadding { padding: 20px 0; }
	.worksList .works-post { width: 90%; margin: 0 auto 5%; }
	.worksList .works-post:nth-child(3n+2):last-child { margin-right:auto; }
	.worksList .works-cat { font-size: 10px; }
	.worksList h4 { font-size:14px; }
	.worksList .excerpt { font-size: 12px; }
}

/* works-detail */
.works-eyecatch { width: 100%; height: auto; overflow: hidden; display: block; }
.works-eyecatch img { width: 100%; height: 100%; object-fit: cover;  max-height: 810px;}

@media screen and (max-width:768px) {
	.works-eyecatch {z-index: 1; overflow: hidden; height: 350px;}
}

/* news-top */
.newsList .wrappadding { padding: 50px 0; }
.newsList .news-post { margin-bottom: 40px; }
.newsList a.item {display: flex; flex-wrap: wrap; justify-content: space-between; }
.newsList a.item img { width: 50%; height:211px; object-fit:cover; }
.newsList a.item .inner { width: 44%; padding: 3%; background-color: #EFEDE8; height:151px; overflow: hidden; }
.newsList .news-meta { color: #777777; }
.newsList h4 { font-size:16px; font-weight: 600; margin: 20px auto 0; padding: 0; }
.newsList .excerpt { font-size: 14px; margin: 15px auto 0; padding: 0; height: 84px; overflow: hidden; }

.newsList a{display: block;height: 100%; padding: 0 0 15px;}
.newsList a:hover{opacity: 0.8;}
.newsList_img{width: 100%; height: 210px;object-fit:cover;overflow: hidden;}
.newsList_more a{display: block; border: 1px solid #555; text-align: center;padding: 10px 0;font-size:14px; width: 220px;margin: 20px auto 0;}

@media screen and (max-width:768px) {
	.newsList .wrappadding { padding: 20px 0; }
	.newsList .news-post { margin-bottom: 5%; }
	.newsList a.item img { width: 90%; margin: 0 auto; height:142px; }
	.newsList a.item .inner { width: 80%; padding: 5%; margin: 0 auto; }
	.newsList .news-meta { font-size: 10px; }
	.newsList h4 { font-size:14px; }
	.newsList .excerpt { font-size: 12px; }	
}

/* ページネーション */
.pagination {font-size: 14px; text-align: center; margin: 30px auto 20px;}
.pagination span, .pagination span a {display: inline; }
.pagination span.current, .pagination span.disabled, .pagination span.first a, .pagination span.last a, .pagination span.prev a, .pagination span.next a, .pagination span.number a {margin: 0 4px; padding: 12px 16px; border: 1px solid #bbb; }
.pagination span.disabled, .pagination span.first a, .pagination span.last a, .pagination span.prev a, .pagination span.next a { padding: 12px;}
.pagination span.disabled, .pagination span.prev a, .pagination span.next a { border: 0;}
.pagination span.current, .pagination span a:hover { background: #555; color: #fff;}
.pagination span.prev a:hover, .pagination span.next a:hover {background: none; color: #BA963B;}

@media screen and (max-width:768px) {
	.pagination {font-size: 11px; letter-spacing: 0;}
	.pagination span.current, .pagination span.disabled, .pagination span.first a, .pagination span.last a, .pagination span.prev a, .pagination span.next a, .pagination span.number a {margin: 0 1px; line-height: 11px;}
	.pagination span.disabled, .pagination span.first a, .pagination span.last a, .pagination span.prev a, .pagination span.next a { padding: 12px 5px;}

}

/* Widget */
.widget-area {padding: 40px 0;}

.widget-inner{display: flex; flex-wrap: wrap; justify-content: space-between;}

.widget-item-left {width: 65%;}
.widget-item-right {width: 30%;}

.widget-item-title {font-size: 40px;}
.widget-item-title span {font-size: 12px; display: block;}

.widget-inner ul {	width: 100%; margin: 20px auto 40px;}

.widget-inner ul li { font-size: 14px; line-height: 1.8; border-bottom: 1px solid #bbb; padding: 1em 0;}

.widget-area a:hover {color: #BA963B;}

@media screen and (max-width:768px) {
	.widget-item-left, .widget-item-right {width: 100%;}
	.widget-item-title {text-align: center;}

}

.cp_ipselect {
	overflow: hidden;
	width: auto;
	margin: 20px auto;
	text-align: center;
}
.cp_ipselect select {
	width: 100%;
	padding-right: 1em;
	cursor: pointer;
	text-indent: 0.01px;
	text-overflow: ellipsis;
	border: none;
	outline: none;
	background: transparent;
	background-image: none;
	box-shadow: none;
	-webkit-appearance: none;
	appearance: none;
}
.cp_ipselect select::-ms-expand {
    display: none;
}
.cp_ipselect.cp_sl01 {
	position: relative;
	border: 1px solid #bbbbbb;
	border-radius: 2px;
	background: #ffffff;
}
.cp_ipselect.cp_sl01::before {
	position: absolute;
	top: 1.3em;
	right: 10px;
	width: 0;
	height: 0;
	padding: 0;
	content: '';
	border-left: 6px solid transparent;
	border-right: 6px solid transparent;
	border-top: 6px solid #666666;
	pointer-events: none;
}
.cp_ipselect.cp_sl01 select {
	padding: 10px 38px 10px 10px;
	color: #666666;
}

/* 記事投稿用のデザインテンプレート */
.blogbox {background:#f5f5f5; padding:30px 30px calc(30px - 1em); border:1px solid #ccc; margin-bottom:80px;}

.text-center {text-align:center;}
.text-left {text-align:left;}
.text-right {text-align:right;}

.blogh2 h2 {padding:0.3em 0 0; margin-bottom:0;}
.blogh2 h2::after {width:100%; height:2px; background:#ccc; margin:0.5em auto 0;}

.bloglinkbtn div.btnbox{text-align: center; margin: 30px 0;}
.bloglinkbtn a { color:#000; display:inline-block; border: 1px solid #555; text-align: center; padding: 10px 20px; font-size: 14px; width: auto; min-width: 250px; }
.bloglinkbtn a:hover {color:#fff;}
.bloglinkbtn a::before {
	content: "";
    position: absolute;
    z-index: -1;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: #555;
    -webkit-transform: scaleY(0);
    transform: scaleY(0);
    -webkit-transform-origin: 100% 100%;
    transform-origin: 100% 100%;
    -webkit-transition-property: transform;
    transition-property: transform;
    -webkit-transition-duration: 0.1s;
    transition-duration: 0.1s;
    -webkit-transition-timing-function: ease-out;
    transition-timing-function: ease-out;
	}
.bloglinkbtn a:hover::before {-webkit-transform: scaleY(1);
    transform: scaleY(1);}