@charset "utf-8";
/* CSS Document */
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@500&family=Noto+Serif+JP:wght@500&display=swap');
body{font-family: 'Noto Serif JP', "游明朝", "YuMincho", "ＭＳ Ｐ明朝", "MS PMincho","ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "Sawarabi Mincho", "serif";}
p{font-family: 'Noto Sans JP',"游ゴシック Medium", "游ゴシック体", "Yu Gothic Medium", YuGothic,"ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;}

@font-face {
    font-family: 'honoka';
    src: url('../img/Honoka-Shin-Antique-Maru_R.ttf') format('ttf'),
        url('../img/Honoka-Shin-Antique-Maru_R.woff')  format('woff');
}


/*header*/
#header{background-color: rgba(255,255,255,0.7);}

/***　pager　***/
.pager li a{
	height: 60px;
	line-height: 60px;
}
.pager li.prev a, .pager li.next a{padding: 0 20px}
.pager li:not(.prev) a,.pager li:not(.next) a{width: 60px;}


/***　page_title ***/
#page_title{margin-bottom: 100px;}
.page_title_box{
	background-color: transparent;
	padding: 0;
    width: 80%;
}
#page_bg{
	position: relative;
	height: 500px;
	background-image: url(../img/img21.jpg)!important;
}
#page_bg::before{
	content: "";
    display: block;
    width: 100%;
    height: 100%;
    background-color: rgba(175,175,175,0.6);
    position: absolute;
    top: 0;
    left: 0;
}
/* アニメーションで傾斜がついている文字列を水平に戻す*/
.smoothTextTrigger{
	transition: .8s ease-in-out;
	transform: translate3d(0,100%,0) skewY(12deg);
	transform-origin: left;
	display: block;
}
.smoothTextTrigger.smoothTextAppear{
    transform: translate3d(0,0,0) skewY(0);
}
/*共通*/
#wrap{overflow: hidden;}
.font_bold{font-weight: normal;}
.under_page{
	background-color: #fff;
	max-width: 1500px;
	padding: 50px;
	border: 4px double #eee;
	position: relative;
	margin: 0 auto;
}
.under_page::before,.under_page::after{
	content: "";
    display: block;
    position: absolute;
    background-image: url(../img/dec1.png);
    background-repeat: no-repeat;
    background-size: contain;
    width: 15%;
    max-width: 140px;
    height: 300px;
    top: -100px;
      left: -80px;
    transform: rotate(30deg);
	opacity: 0.7;
}
.under_page::after{
	background-image: url(../img/dec2.png);
	top: inherit;
	left: inherit;
	right: 0;
	bottom: -150px;
	 transform: rotate(30deg);
}
.cate_title{
    border: none;
    position: relative;
    padding-bottom: 20px;
    display: block;
    text-align: center;
    margin-bottom: 50px;
	margin-left: 0;
	padding-top: 70px;
    background-image: url(../img/title_icon.png);
    background-repeat: no-repeat;
    background-position: center top;
}

.cate_title:before{
    content: "";
    position: absolute;
    width: 50px;
    height: 2px;
    bottom: 0;
    background-color: #cfb2b2;
    left: 50%;
    transform: translateX(-50%);
}
footer{margin-top: 100px;}

/* cms 6-c */
#cms_6-c .arrow {
	bottom: -100px;
	left: 50%;
	transform: translate(-50%,0);
	height: 100px;
	z-index: 888;
}
#cms_6-c .circle  {
	bottom: -20px;
	left: 50%;
	transform: translate(-50%,-50%);
	height: 20px;
}
#cms_6-c .cate_box:last-of-type > span {
	display: none;
}
#pc_nav ul li a{
	background-image: url(../img/icon01.png);
    background-repeat: no-repeat;
    background-position: center top 20px;
}
#pc_nav ul li:nth-of-type(2) a{background-image: url(../img/icon02.png);}
#pc_nav ul li:nth-of-type(3) a{background-image: url(../img/icon03.png);}
#pc_nav ul li:nth-of-type(4) a{background-image: url(../img/icon04.png);}
#pc_nav ul li:nth-of-type(5) a{background-image: url(../img/icon05.png);}

#cms_3-c #cate0 .cate_txt1{font-family: "honoka";}


/* ---------- tab ---------- */
@media screen and (max-width: 769px){
	#page_title {
    margin-bottom: 50px;
}
}


/* ---------- スマートフォン ---------- */
@media screen and (max-width: 667px){
	.under_page{padding: 10px;}
	.under_page::before, .under_page::after{
		width: 23%;
    top: -70px;
    left: -80px;
	}
	.under_page::after {
		top: inherit;
		left: inherit;
    right: 15px;
    bottom: -255px;
}
	#page_bg{
	height: 300px;
}
	#page_title {
    margin-bottom: 0;
}
	.cate_title{
		margin-bottom: 20px;
		padding-top: 50px;
		background-size: 50px;
	}
	.pager li:not(.prev) a, .pager li:not(.next) a {
    width: 20px;
}
.pager li.prev a, .pager li.next a {
    padding: 10px;
}
.pager li a {
    height: 30px;
    line-height: 30px;
    padding: 10px;
}
}