@charset "utf-8";
/*
Theme Name: 合同会社アンノーン
Author: Kotaro Saito
Description:  合同会社アンノーンのテーマ
version: 1.0.0
*/

/*common
-----------------------------------------------------------------------------------------*/
html,body{
	width: 100%;
	margin: 0 auto;
	padding: 0;
	text-align: center;
	font-family: "Zen Maru Gothic", sans-serif;
	font-size: 16px;
	color: rgba(58, 28, 0, 1);
}

.font-comfortaa {
  font-family: "Comfortaa", sans-serif;
}

.font-capriola {
  font-family: "Capriola", sans-serif;
}

p{
	text-align: left;
}


@media screen and (min-width:768px) {
.sp{
	display: none;
}
}

@media screen and (max-width:767px) {
.pc{
	display: none;
}

html,body{
	font-size: 14px;
}
}


/*header
-----------------------------------------------------------------------------------------*/
.header-link{
	color: rgba(58, 28, 0, 1);
}

.header-link:hover{
	color: rgba(224, 123, 0, 1);
}

.header-link:hover{
	color: rgba(235, 163, 37, 1);
}

.header-flex{
	padding-left: 100px;
	height: 100px;
	position: fixed;
	top: 0;
	z-index: 999;
	width: 100%;
	background-color: rgba(255, 255, 255, 1);
	align-items: center;
	box-shadow: 4px 4px 10px rgba(58, 28, 0, 0.2);
}

.header-link-flex{
	gap: 10px 30px;
	width: calc(100% - 270px - 400px);
	padding: 10px 30px 0;
	justify-content: end;
}

.header-inner-flex{
	gap: 30px;
}

.header-logo{
	width: 270px;
}

.header-color{
	color: rgba(224, 123, 0, 1);
}

.header-color:hover{
	color: rgba(235, 163, 37, 1);
}

.arrow-bottom {
	display: inline-block;
	width: 10px;
	height: 10px;
	margin: 0 0 3px 10px;
	border-bottom: 2px solid #000;
	border-right: 2px solid #000;
	transform: rotate(45deg);

}

.header-box-flex{
	width: 400px;
}

.header-link-box{
	width: 200px;
	height: 100px;
	color: rgba(255, 255, 255, 1);
	background-color: rgba(235, 163, 37, 1);
}

.header-link-box:hover{
	background-color: rgba(234, 166, 110, 1);
}

.header-link-box2{
	background-color: rgba(224, 123, 0, 1);
}

.header-link-box span{
	vertical-align: middle;
	line-height: 6;
}

.logo-contact{
	vertical-align: middle;
	width: 20px;
	display: inline-block;
	margin-right: 10px;
	object-fit: contain;
}

.header-link2{
	margin-bottom: 10px;
	display: block;
}

.drop_menu{
	position: relative;
}

.child_menu{
	position: absolute;
	display: none;
	transition: .3s;
}
/* ホバー時 */
.drop_menu:hover .child_menu {
	transition: .3s;
	display: block;
	transform: scale(1,1); /*高さを100%に*/
	background-color: rgba(255, 255, 255, 1);
	width: 250px;
	left: -50px;
	top: 100%;
	text-align: left;
	padding: 30px 0 20px 50px;
}

.sp-navigation{
	display: none;
}
@media screen and (max-width:1520px) {
	.header-link-box {
		width: 160px;
	}

	.header-flex {
		padding-left: 20px;
	}

	.header-box-flex {
		width: 320px;
	}

	.header-logo {
		width: 200px;
	}

	.header-link-flex {
		width: calc(100% - 200px - 320px);
	}
}

@media screen and (max-width:1300px) {
	.header-link-flex{
		display: none;
	}

	.sp-navigation{
		display: block;
	}

	.header-flex {
		padding: 0 60px 0 20px;
		justify-content: space-between;
	}

	.header-flex {
		z-index: 4;
	}

	.drawer-hamburger {
		z-index: 999;
	}

	.header-flex {
		height: 60px;
	}

	.header-link-box {
		height: 60px;
	}

	.header-link-box span {
		line-height: 4;
	}

	nav.drawer-nav {
		top: 60px;
		padding-top: 60px;
	}

	.drawer--right.drawer-open button.drawer-hamburger {
		right: 0rem;
	}



}

@media screen and (max-width:1023px) {
	.header-link-box {
		height: 70px;
	}

	.header-flex {
		height: 70px;
	}

	.header-link-box span {
		line-height: 4.4;
	}

}


@media screen and (max-width:767px) {

	.header-box-sp {
		position: fixed;
		width: 100%;
		bottom: 0;
		left: 0;
		z-index: 999;
	}

	.header-link-box {
		height: 50px;
		width: 50%;
	}

	.header-link-box span {
		line-height: 3.5;
	}

}


/*footer
-----------------------------------------------------------------------------------------*/
.footer-contact-top{
	background: linear-gradient(rgba(224, 123, 0, 1), rgba(235, 163, 37, 1));
}

.footer-contact-flex{
	gap: 60px;
	justify-content: center;
}

.footer-contact-title{
	color: transparent;
	-webkit-text-stroke: 1px rgba(255, 255, 255, 1); 
	font-size: 7.5rem;
	line-height: 0.7;
	text-align: left;
}

.footer-contact-title2{
	text-align: right;
}

.footer-contact-white{
	background-color: rgba(255, 255, 255, 1);
	padding: 50px 120px;
}

.footer-contact-link{
	width: fit-content;
	color: rgba(224, 123, 0, 1);
	font-size: 1.3rem;
	margin: auto;
	border-radius: 30px;
	padding-right: 30px;
	height: 50px;
	display: block;
}

.footer-contact-link:hover{
    background-color: rgba(224, 123, 0, 1);
    color: rgba(255, 255, 255, 1);
}

.footer-contact-link span{
    vertical-align: middle;
}

.footer-contact-text{
	font-size: 1.3rem;
	margin: 100px 0;
}

.footer-recruit-title{
	font-size: 2.6rem;
	font-weight: 500;
	color: rgba(224, 123, 0, 1);
}

.footer-recruit-box{
	padding-top: 200px;
}

.footer-copy-right{
	padding: 80px 0 10px;
	text-align: left;
}

.footer-flex{
	justify-content: space-between;
}

.footer-copy-name{
	font-size: 1.7rem;
	font-weight: 500;
}

.footer-copy-add{
	margin: 15px 0;
}

.footer-link-flex{
	gap: 50px;
	justify-content: space-between;
}

.footer-link{
	font-weight: 500;
	margin-bottom: 35px;
	display: block;
	color: rgba(58, 28, 0, 1);
}

.footer-link2{
	margin-bottom: 15px;
}

.footer-link3{
	margin-bottom: 15px;
	font-weight: 400;
}

.footer-link4{
	margin-bottom: 0;
	font-weight: 400;
}

.footer-copy-flex{
	justify-content: space-between;
	padding-top: 15px;
	margin-top: 50px;
	border-top: 1px solid rgba(224, 123, 0, 1);
}

@media screen and (max-width:1500px) {
	.footer-contact-white {
		padding: 50px;
	}

	.footer-contact-flex {
		gap: 45px;
	}
}

@media screen and (max-width:1400px) {
.footer-link-flex{
	position: relative;
}

.footer-link-contact{
	position: absolute;
	top: 50%;
	right: 110px;
}
}

@media screen and (max-width:1200px) {

	.footer-recruit-box {
		padding-top: 0px;
	}

	.footer-contact-white {
        padding: 50px 100px;
    }

	.footer-contact-box{
		margin-right: auto;
	}

	.footer-recruit-box{
		margin-left: auto;
	}

	.footer-link-non{
		display: none;
	}

}

@media screen and (max-width:1023px) {
	.footer-contact-box,.footer-recruit-box{
		margin: auto;
	}
}


@media screen and (max-width:767px) {

	.footer-contact-title {
    font-size: 5rem;
	}

	.footer-contact-white {
        padding: 20px 10px;
    }

	 .footer-contact-text {
		font-size: 1rem;
		margin: 20px 0;
	}

	.footer-copy-right{
		padding: 30px 0 60px;
	}

	.footer-link-flex{
		display: none;
	}

	.footer-copy-flex {
    padding-top: 10px;
    margin-top: 10px;
	}
}

/*お知らせ
-----------------------------------------------------------------------------------------*/
.home-left{
	width: 70%;
}

.home-list{
	padding-left: 25px;
	padding-bottom: 50px;
	margin-bottom: 50px;
	border-bottom: 1px solid rgba(224, 123, 0, 1);
	position: relative;
}

.home-text-flex{
	gap: 50px;
	align-items: center;
}

.home-link{
	color: rgba(58, 28, 0, 1);
}

.cat-nwes{
	font-weight: 500;
	display: block;
	line-height: 2.5;
	width: 150px;
	color: rgba(224, 123, 0, 1);
	border: 1px solid rgba(224, 123, 0, 1);
}

.cat-consulting{
	font-weight: 500;
	display: block;
	line-height: 2.5;
	width: 150px;
	color: rgba(209, 178, 229, 1);
	border: 1px solid rgba(209, 178, 229, 1);
}

.cat-others{
	font-weight: 500;
	display: block;
	line-height: 2.5;
	width: 150px;
	color: rgba(187, 187, 187, 1);
	border: 1px solid rgba(187, 187, 187, 1);
}

.cat-medical{
	font-weight: 500;
	display: block;
	line-height: 2.5;
	width: 150px;
	color: rgba(233, 140, 182, 1);
	border: 1px solid rgba(233, 140, 182, 1);
}

.cat-jewelry{
	font-weight: 500;
	display: block;
	line-height: 2.5;
	width: 150px;
	color: rgba(163, 209, 234, 1);
	border: 1px solid rgba(163, 209, 234, 1);
}

.cat-funeral{
	font-weight: 500;
	display: block;
	line-height: 2.5;
	width: 150px;
	color: rgba(163, 217, 185, 1);
	border: 1px solid rgba(163, 217, 185, 1);
}

.cat-sorting{
	font-weight: 500;
	display: block;
	line-height: 2.5;
	width: 150px;
	color: rgba(234, 166, 110, 1);
	border: 1px solid rgba(234, 166, 110, 1);
}

.home-title{
	margin-top: 20px;
	text-align: left;
	width: 90%;
}

.home-flex{
	gap: 100px;
}

.home-comfortaa{
	font-size: 1.4rem;
	color: rgba(224, 123, 0, 1);
	text-align: left;
}

.home-category{
	margin-top: 15px;
}

.side-top{
	margin-top: 50px;
}

.side-box{
	margin-top: 15px;
}

.select-archive{
	border: 1px solid rgba(224, 123, 0, 1);
	width: 200px;
	padding: 15px;
	color: rgba(224, 123, 0, 1);
}

.side-box{
	position: relative;
}

.side-box::after{
	position: absolute;
	content: '';
	height: 50px;
	width: 1px;
	background-color: rgba(224, 123, 0, 1);
	top: 0;
	right: 50px;
}

.arrow-right {
	position: absolute;
	top: 50%;
	right: 25px;
  display: inline-block;
  width: 10px;
  height: 10px;
  margin: 0 10px;
  border-top: 2px solid rgba(224, 123, 0, 1);
  border-right: 2px solid rgba(224, 123, 0, 1);
  transform: rotate(45deg);
}

.wp-pagenavi a:hover, .wp-pagenavi span.current {
	color: rgba(224, 123, 0, 1);
	border: none;

}

.wp-pagenavi a, .wp-pagenavi span {
	text-decoration: none;
	margin: 0 25px;
	color: rgba(89, 70, 57, 1);
	border: none;
}

a.nextpostslink, a.previouspostslink{
		color: rgba(224, 123, 0, 1);
		width: 40px;
		height: 40px;
		display: inline-block;
		border: 1px solid rgba(224, 123, 0, 1);

}

@media screen and (max-width:1200px) {
	.home-flex {
		gap: 77px;
	}
}

@media screen and (max-width:1023px) {
	.arrow-right {
		right: 0px;
	}

	.home-flex {
		gap: 30px;
    }

	 .home-left {
		width: 65%;
	}
}


@media screen and (max-width:767px) {
	.home-left {
		width: 100%;
	}

	.home-list {
		padding-left: 0px;
		padding-bottom: 15px;
		margin-bottom: 20px;
	}

	.home-text-flex {
		gap: 15px;
	}

	.home-title {
		margin-top: 10px;
	}

	.home-category-top{
		position: relative;
	}

	.hone-sidebar{
		position: absolute;
		top: 0;
		right: 0;
	}

	.select-archive {
		width: 150px;
	}

	.hone-sidebar {
		position: absolute;
		top: -50px;
		right: -170px;
    }
}



/*single
-----------------------------------------------------------------------------------------*/
.single-top{
	width: 80%;
	margin: auto;
}

.single-img{
	width: 80%;
	margin: auto;
	margin-bottom: 25px;
}

.single-img img{
	object-fit: cover;
	height: 500px;
}

.single-content{
	line-height: 1.7;
}

.single-link-flex{
	justify-content: center;
	align-items: center;
	gap: 50px;
	margin-top: 50px;
}

.single-link{
	color: rgba(224, 123, 0, 1);
}

.single-arrow a{
	width: 40px;
	padding: 5px 0 10px;
	display: inline-block;
	border: 1px solid rgba(224, 123, 0, 1);
	color: rgba(224, 123, 0, 1);
}


@media screen and (max-width:767px) {
}


/*404
-----------------------------------------------------------------------------------------*/
div.error-message{
	font-size: 150%;
}

@media screen and (max-width:767px) {
div.error-message{
	font-size: 120%;
}
}