/*
Theme Name: itibu
Theme URI: https://wordpress.org/themes/itibu/
Author: ITIBU Consulting
Author URI: https://wordpress.org/themes/itibu/
Description: ITIBUのテーマ
Version: 1.0
*/
*{
	margin:0;
	padding:0;
	line-height:1;
}
body{
	font-size:16px;
	color:#333;
	font-family:'Noto Sans JP',"游ゴシック体", "Yu Gothic","メイリオ", Meiryo,sans-serif;
  　font-weight: 400;
}
a{
	text-decoration: none;
}
li{
	list-style:none;
}
/* PC */
	/* common */
	.headline p{
		font-size:14px;
	}
	.headline h3{
		font-size:24px;
		font-weight:normal;
		margin-top:5px;
	}
	button{
		border: none;
  		background: none;
	    font: inherit;
        color: inherit;
        cursor: pointer;
        outline: none;
	}	
	/* header */
	header{
		background: #2D6EB0;
	}
	.header__contents{
		width:100%;
		display: flex;
		justify-content: space-between;
		margin:auto;
	}
	.header__contents h1 img{
		width:156px;
		margin:20px 0 10px 20px;
	}
	/* メニュー */
	.drawer_hidden {
		display: none;
	  }
	.drawer_open {
		display: flex;
		justify-content: center;
		align-items: center;
		right: 0;
		z-index: 100;
		cursor: pointer;
		width:80px;
		height:80px;
		background-color: #2D6EB0;
		position: -webkit-sticky;
        position: fixed;
		top:0;
	}
	.drawer_open span,
	.drawer_open span:before,
	.drawer_open span:after {
		content: '';
		display: block;
		height: 3px;
		width: 45px;
		border-radius: 3px;
		background: #ffffff;
		transition: 0.5s;
		position: absolute;
	}
	.drawer_open span:before {
		bottom: 10px;
	}
	.drawer_open span:after {
		top: 10px;
	}
	#drawer_input:checked ~ .drawer_open span {
		background: rgba(255, 255, 255, 0);
	}
	#drawer_input:checked ~ .drawer_open span::before {
		bottom: 0;
		transform: rotate(45deg);
	}
	#drawer_input:checked ~ .drawer_open span::after {
		top: 0;
		transform: rotate(-45deg);
	}	
	.nav {
		width:100%;
		height: 100%;
		position: fixed;
		bottom: 100%;
		left: 0%; 
		z-index: 99;
		background:#ffffff;
		transition: .5s;
		text-align: center;
		padding-top: 20px;
	  }	
	  .nav__inner h2{
		margin-top:30px;
		width:40%;
	  }
	  .nav_list {
		list-style: none;
		text-align: left;
	  }	 
	  .nav_list__items{
		margin-top:30px;
	  }
	  .nav_list__items a{
		color: #333333;
	  }
	  .nav_list__items a:hover{
		color:#E5A800;
		transition: .5s;
	  }
	  #drawer_input:checked ~ .nav {
		bottom: 0;
	  }
	/* main */
	main{
		position:relative;
	}
	.main__contents__back img{
		height:100%;
		width:100%;
		object-fit:cover;
	}
	.main__contents__upper_tx{
		display:block;
		position:absolute;
		left:18vw;
		top:17vw;
	}
	.main__contents__lower_tx{
		display:block;
		position:absolute;
		left:18vw;
		top:24vw;
	}
	.main__contents__img img{
		display:block;
		position:absolute;
		width:27vw;
		right:13vw;
		top:110px;
	}
	/* about */
	.about{
		width:95%;
		margin:auto;
	}
	.about_headline{
		margin-top:40px;
	}
	.about__tx{
		margin-top:20px;
	}
	.about__tx p{
		line-height:2;
	}

	/* service */
	.service{
		width:95%;
		margin:auto;
	}
	.service_headline{
		text-align: center;
		margin-top:100px;
	}
	.service__contents{
		margin-top:40px;
	}
	.service_box{
		background-color:#F5F5F5;
		padding-bottom:20px;
	}
	.service_box__line{
		border: #E5A800 3px solid;
	}
	.service_box__tag{
		background-color: #E5A800;
		padding:7px 15px 10px 15px;
		width:fit-content;
	}
	.service_box__tag__tx{
		font-size:14px;
	}
	.service_box__img{
		margin:20px auto 20px auto;
	}
	.service_box__img img{
		width: 100%;
	}
	.service_box__description dt{
		font-size:24px;
	}
	.service_box__description dd{
		margin-top:25px;
		margin-bottom:10px;
		line-height: 1.5;
	}
	/* example */
	.example{
		margin-top:100px;
		background-color: #2D6EB0;
		color:#ffffff;
	}
	.example__back img{
		height:100%;
		width:100%;
		object-fit:cover;
	}
	.example_article__wrapper{
		width:95%;
		margin:auto;
	}
	.example_article__wrapper .inner_items{
		color:#fff;
	}
	.example_article__wrapper .inner_line{
		border-bottom:1px solid #fff;
	}
	.example_article:hover{
		cursor: pointer;
		opacity: 0.6;
	}
	.example_headline{
		width:100%;
		text-align: center;
		margin-bottom: 40px;
	}
	.example_article__day{
		margin-top:8px;
	}
	.wrapper_tag{
		width:15%;
	}
	.example_article__tag{
		background-color: #E5A800;
		padding:10px 15px;
		width:fit-content;
		margin-bottom:5px;
	}
	.example_article__tag__tx{
		font-size:14px;
	}
	.example_article__tx{
		margin-top:8px;
	}
	.article_line{
		border-bottom:1px #ffffff solid;
	}
	.more{
		text-align: right;
		margin:65px auto 0 auto;
	}
	.more__btn{
		width:116px;
	}
	.more__btn:hover{
		opacity: 0.7;
	}
	/* consultant */
	.consultant{
        padding-top:90px;
		background-color: #2D6EB0;
		color:#333333;
		position:relative;
	}
	.consultant__article{
		background-color: #f5f5f5;
		padding:80px 3.4% 80px 34%;
		margin-left:260px;
	}
	.consultant_headline{
		text-align: right;
	}
	.consultant__tx{
		text-align: right;
		margin-top:25px;
	}
	.consultant__tx p{
		line-height:2;
	}
	.consultant__img{
		position:absolute;
		bottom:0;
		margin-left:5.6%;
		width:33%;
		z-index:2;
	}
	.consultant__img img{
		width:100%;
	}
	.consultant__back{
		width:100%;
		position:absolute;
		bottom:-5px;
	}
	.consultant__back img{
		width:260px;
	}
	/* infomation contact */
	.infoContact_wrapper{
		width:95%;
		margin:100px auto 100px auto;
	}
	.infomation{
		flex:1;
	}
	.infomation_headline{
		text-align: center;
		margin-bottom: 40px;
	}
	.infomation_article{
		display: flex;
		gap:5%;
		margin:55px 5% 5px 5%;
		color:#333333;
	}
	.infomation_article:hover{
		cursor: pointer;
		opacity: 0.7;
	}
	.contact{
		flex:1;
	}
	.contact_headline{
		text-align: center;
		margin-bottom:55px;
	}
	.contact__items{
		text-align: center;
	}
	.contact__items__button{
		width:58%;
		background-color: #E5A800;
		color:#ffffff;
		font-size:24px;
		height:80px;
		margin:70px auto 0 auto;
		border-radius: 50px;
		transition: all 0.5s 0s ease;
	}
	.contact__items__button:hover{
		background-color: #F5F5F5;
		color:#333333;
	}
	/* footer */
	footer{
		text-align: center;
		margin-bottom:20px;
	}
	address{
		font-style:normal;
		font-size:12px;
	}
/* animation */
.js_scroll_up{
	opacity: 0;
    transform: translateY(30px);
}
.is-animated {
	opacity: 1;
    transform: translateY(0);
	transition: all 0.7s 0s ease;
}
.js_scroll_up .service_box{
	opacity: 0;
    transform: translateY(30px);
}
.is-animated .service_box{
	opacity: 1;
    transform: translateY(0);
	transition: all 0.7s 0s ease;
}
.is-animated  .js_box_first{
	transition-delay: .3s;
}
.is-animated  .js_box_second{
	transition-delay: .6s;
}
.is-animated  .js_box_third{
	transition-delay: .9s;
}
.js_scroll_up .js_tx{
	opacity: 0;
    transform: translateY(30px);
}
.is-animated .js_tx{
	opacity: 1;
    transform: translateY(0);
	transition: all 0.7s 0s ease;
}
.is-animated  .js_upper{
	transition-delay: .4s;
}
.is-animated  .js_lower{
	transition-delay: 1.2s;
}

@media screen and (min-width:960px){
	.header__contents h1 img{
		width:156px;
	}
	.nav__inner{
		display:flex;
		gap:20%;
		margin:80px 15% 80px 15%;
	}
	.nav__inner h2 img{
		width:50%;
	}
	.main__contents__upper_tx img,
	.main__contents__lower_tx img{
		width:22vw;
	}
	.main__contents__img img{
		right:13vw;
	}
	.service__contents{
		display: flex;
		column-gap: 1.6%;
		margin-top:40px;
	}
	.service_box{
		width:32.6%;
		background-color:#F5F5F5;
	}
	.service_box__img{
		width:40%;
	}
	.service_box__description{
		text-align: center;
		width:90%;
		margin:0 auto 20px auto;
	}
	.example_article{
		display: flex;
		gap:5%;
		margin:55px 5% 0 5%;
		color:#ffffff;
	}
	.consultant__img{
		margin-left:5.6%;
		width:33%;
	}
	.consultant__article{
		padding:80px 3.4% 80px 34%;
		margin-left:260px;
	}
	.infoContact_wrapper{
		display:flex;
		gap:3.3%;
	}
}
@media screen and (min-width:560px) and (max-width:959px){
	.header__contents h1 img{
		width:120px;
	}
	.nav__inner{
		display:flex;
		gap:20%;
		margin:80px 15% 80px 15%;
	}
	.nav__inner h2 img{
		width:70%;
	}
	.main__contents__upper_tx img,
	.main__contents__lower_tx img{
		width:30vw;
	}
	.main__contents__img img{
		right:0;
	}
	.service__contents{
		margin-top:40px;
	}
	.wrapper_service_tablet{
		display: flex;
	}
	.service_box{
		background-color:#F5F5F5;
		margin-bottom:30px;
	}
	.service_box__img{
		width:20%;
		margin:auto 20% auto 10%;
	}
	.service_box__description{
		text-align: left;
		width:40%;
		margin-right:10%;
        align-self: center;
	}
	.example_article{
		color:#ffffff;
	}
	.wrapper_tagday{
		display:flex;
		gap:5%;
		margin:55px 5% 0 5%;
	}
	.example_article__tx{
		margin:10px 5% 5px 5%;
	}
	.consultant__img{
		margin-left:-20px;
		width:33%;
	}
	.consultant__article{
		padding:80px 3.4% 80px 22%;
		margin-left:70px;
	}
	.consultant__back{
		left:-190px;
	}
	.infoContact_wrapper{
		display:flex;
		gap:3.3%;
	}
}
@media screen and (max-width:560px){
	.header__contents h1 img{
		width:100px;
	}
	.nav__inner{
		margin:80px 15% 80px 15%;
	}
	.nav__inner h2 img{
		width:100%;
	}
	.main__contents__upper_tx img,
	.main__contents__lower_tx img{
		width:35vw;
		margin-top:20px;
	}
	.main__contents__img img{
		right:0;
	}
	.service__contents{
		margin-top:40px;
	}
	.service_box{
		background-color:#F5F5F5;
		margin-bottom:30px;
	}
	.service_box__img{
		width:30%;
	}
	.service_box__description{
		text-align: left;
		width:90%;
		margin:0 auto 20px auto;
	}
	.example_article{
		color:#ffffff;
	}
	.wrapper_tagday{
		display:flex;
		gap:5%;
		margin:55px 5% 0 5%;
	}
	.example_article__tx{
		margin:10px 5% 5px 5%;
	}
	.consultant__img{
		display: none;;
	}
	.consultant__article{
		padding:80px 3.4% 80px 10%;
		margin-left:70px;
	}
	.consultant__back{
		left:-190px;
	}
	.contact{
		margin-top:100px;
	}
}