@charset "UTF-8";
/*
    Template: swell
    Theme Name: SWELL CHILD
    Theme URI: https://swell-theme.com/
    Description: SWELLの子テーマ
    Version: 1.0.0
    Author: LOOS WEB STUDIO
    Author URI: https://loos-web-studio.com/

    License: GNU General Public License
    License URI: http://www.gnu.org/licenses/gpl.html
*/

.post_content h1, .post_content h2, h5, .menu-title, .p-mainVisual__slideTitle, a.btn_23, .foot_box p, .btn_design, .btnripple3, .-type-card .p-postList__title, .-type-list .p-postList__title, .-type-list2 .p-postList__title, .c-pageTitle[data-style=b_bottom] .c-pageTitle__inner, .wpcf7-form .wpcf7-submit {
	font-family: 'Marcellus', serif;
}

img {
	width: 100%;
	vertical-align: middle;
}

.sec1 {
	padding: 300px 0 0 0;
	margin-bottom: 0 !important;
}

.sec2 {
	padding: 300px 0;
	margin-bottom: 0 !important;
}
.wpcf7-spinner {
	display: none;
}
.p-mainVisual__scroll {
    color: #000 !important;
}
.p-mainVisual__slideTitle {
    font-size: 3rem;
    text-shadow: 0px 3px 6px rgba(0, 0, 0, 0.6);
}
	.w-beforeFooter {
    margin: 0 auto;
}
.flex_box {
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
}
.post_content h1 {
    font-size: 3em;
	 letter-spacing: 0.1em;
}
.post_content h2 {
    color: #000;
    text-align: center;
    font-size: 2rem;
    letter-spacing: 0.1em;
	 background: initial;
    margin: 0;
	 padding: 0;
}
.post_content h2::before {
    content: initial;
}
h5 {
	    font-size: 1em;
    font-weight: normal;
}
h6 {
	font-size: 0.8em;
    text-align: center;
    font-weight: normal;
}

.kome {
	font-size: 14px;
    text-align: center;
}
.btnripple3{
    /*波紋の基点とするためrelativeを指定*/
  position: relative;
    /*リンクの形状*/
  display:inline-block;
  margin:0 10px 20px 10px;
    text-decoration: none;
    outline: none;
}



/*波形が広がるアニメーション*/
@keyframes circleanime2{
  0%{
    transform: scale(0);
  }
  100%{
    transform:scale(2);
    opacity: 0;
  }
}
.ripple3 {
	position: relative;
	text-align: center;
	margin-top: 100px;
}
/*矢印の設定*/
.ripple3::before {
    content: '';
    position: absolute;
    top: 38%;
    right: 41.8%;
    width: 8px;
    height: 5px;
    border-top: 1px solid #000;
    transform: rotate(45deg);
}
.btnripple3:hover::before {
    content: '';
    position: absolute;
    right:-35px;
    border: 1px solid #CFB390;
    width: 60px;
    height: 60px;
    border-radius: 50%;
	 top: -15px;
  opacity:1;
    animation:1.5s circleanime2 forwards;
}
.ripple3::after {
    content: '';
    position: absolute;
    top: 8%;
    right: 42.5%;
    width: 5px;
    height: 20px;
    border-right: 1px solid #000;
    transform: rotate(90deg);
}
@media (min-width: 481px) and (max-width:1440px) {
.p-mainVisual__slideTitle {
    font-size: 2.5rem;
}
	.sec1 {
	padding: 150px 0 0 0;
	margin-bottom: 0 !important;
}

.sec2 {
	padding: 200px 0;
	margin-bottom: 0 !important;
}
}
@media screen and (max-width: 480px) {
	.sec1 {
    padding: 75px 0 0 0;
	}
	.sec2 {
    padding: 75px 0;
	}
	.flex_box {
    display: block;
	}
	.post_content h1 {
    font-size: 2em;
	}
	.p-mainVisual__slideTitle {
    font-size: 2rem;
	}
	.ripple3 {
    margin-top: 30px;
}
	.ripple3::before {
    right: 29.8%;
	}
	.ripple3::after {
    right: 31.5%;
	}
}


/*ヘッダー*/
.c-gnav a::after {
    height: 1px;
}
.c-gnav>.menu-item>a .ttl {

    letter-spacing: 0.1em;
}
.c-gnav>.menu-item>a {
    padding: 0;
}
@media screen and (min-width: 481px) {
.c-gnav>.menu-item>a {
    padding: 0 12px;
    height: auto;
}
.c-gnav>.menu-item {
    align-items: center;
    display: flex;
}
}


/*post_content*/

.top_under {
	position: relative;
}
.top_under article {
	max-width: 1014px;
	margin: 0 auto;
}

.top_under p, .profile p {
	line-height: 2.5;
}

.top_under .left_box {
	width: 40%;
}

.top_under .right_box {
	width: 56%;
}

.top_under .leaf-img1 {
	position: absolute;
    left: 0;
    bottom: 0;
	
}

.top_under .leaf-img2 {
	position: absolute;
    top: 11rem;
    right: 0;
	
}
.works article {
	max-width: 1014px;
	margin: 0 auto;
}
@media screen and (max-width: 480px) {
.top_under .left_box, .top_under .right_box {
    width: 100%;
}
	.top_under .left_box {
		display: flex;
		align-items: center;
		position: relative;
	}
	.top_under h5 {
		top: 7px;
    left: 10px;
    font-size: 0.7em;
    position: relative;
	}
	.top_under .leaf-img2 {
    position: absolute;
    top: 10%;
    right: 5%;
    width: 50px;
}
	.top_under .leaf-img1 {
    bottom: -5rem;
    width: 50px;
}
}
/*サービス案内*/
.service {
	margin-left: calc(-50vw + 50%);
    margin-right: calc(-50vw + 50%);
}
.service .flex_box {
	margin-top: 100px;
}
.menu-item {
	width: 33.3333%;
	padding-bottom: 10px;
}

.menu-title {
	font-size: 18px;
    text-align: center;
	 padding: 100px 0;
}
.menu-img {
	width: 50%;
	margin: 0 auto;
	overflow: hidden;
}
/*画像傾き*/

.menu-img img{
  width: 100%;
  cursor: pointer;
  transition-duration: 0.5s;
}


.menu-item:hover .menu-img img{
  transform: scale(1.2) rotate(9deg);
  transition-duration: 0.5s;
}

.menu-item p {
	font-size: 14px;
	text-align: center;
	padding-top: 70px;
}
@media (min-width: 481px) and (max-width:1440px) {
.service .flex_box {
    margin-top: 50px;
}
}
@media screen and (min-width: 481px) {
	.brown {
	background: #F5F2EB;
    box-shadow: 1px 1px 13px 1px #ccc inset;
}
}

@media screen and (max-width: 480px) {
.service .flex_box {
    margin-top: 30px;
    display: flex;
	}
	.menu-item {
    width: 50%;
	 padding: 10px;
	}
	.spbrown {
		background: #F5F2EB;
    box-shadow: 1px 1px 13px 1px #ccc inset;
	}
	.menu-title {
    padding: 30px 0;
}
	.menu-img {
    width: 75%;
	}
	.menu-item p {
    padding-top: 30px;
}
}
/*profile*/

.profile {
	position: relative;
}

.profile article {
	max-width: 1014px;
	margin: 0 auto;
}

.profile .leaf-img1 {
	position: absolute;
    left: 0;
    bottom: -20%;
	 z-index: 9999;
	
}

.profile .leaf-img2 {
	position: absolute;
    top: 11rem;
    right: 0;
	
}
@media screen and (max-width: 480px) {
	.profile .left_box {
		display: flex;
		align-items: center;
		position: relative;
	}
	.profile h5 {
		top: 7px;
    left: 10px;
    font-size: 0.7em;
    position: relative;
	}
}
/*skill*/
.skill {
	margin-left: calc(-50vw + 50%);
    margin-right: calc(-50vw + 50%);
	    background: linear-gradient(to bottom, #FBFAF8 0%, #FBFAF8 47%, #F5F2EB 47%, #F5F2EB 100%);
	position: relative;
}

 .skill .left_box {
	width: 48%;
		overflow:hidden;
}
.skill .right_box {
	width: 30%;
	margin: 0 auto;
}

.skill-item {
	width: 49%;
	padding-bottom: 10px;
	
}

.skill .left_box img{
 transition:1s all;
}
.skill-box:hover .left-h img {
  transform:scale(1.1,1.1);
  transition:1.5s all;
}

.my-skill {
	width: 100px;
    position: absolute;
    top: 27%;
    left: 45%;
    transform: translateY(-50%) translateX(-50%);
    -webkit- transform: translateY(-50%) translateX(-50%);
}


@media screen and (max-width: 480px) {
	.skill .right_box {
    width: 90%;
    position: absolute;
    margin: 0 auto;
    top: 34%;
    right: 0;
}
	.skill .left_box {
    width: 100%;
}

	.skill .flex_box {
    display: flex;
		position: relative;
}
	.skill-item {
    width: 32%;
	}
	.profile .leaf-img2 {
    top: 5rem;
    right: 0;
    width: 50px;
}
	.profile .leaf-img1 {
    width: 50px;
    bottom: -10%;
}
}
/*お問い合わせ*/

.contact .kome {
margin: 70px 0 30px 0;
}
.formtable textarea {
	  width: 100%;
}

button, input, select, textarea {
border: 0px solid hsla(0,0%,78%,.5);
}

.caution {
	font-size: 12px;
}
.wpcf7-form .wpcf7-submit  {
	
    border: 1px solid #4b3c2d;
    color: #000 !important;
    font-size: 20px !important;
    padding: 20px 0px !important;
    width: 100%;
	 transition: .5s;
}
.wpcf7-form .wpcf7-submit:hover {
	background: #F5F2EB !important;
}
.wpcf7 form.invalid .wpcf7-response-output {
    border-color: rgba(175, 157, 192, .5);
}

.post_content tbody th:before {
    background-color: initial;
}
.post_content th {
    border-left: 1px solid #4b3c2d;
    border-top: 1px solid #4b3c2d;
    border-bottom: 1px solid #4b3c2d;
	 background: #F5F2EB;
	 border-right: 0px !important;
	 font-weight: normal !important;
	 font-size: 14px;
}
.post_content th p {
	display: inline;
}

.post_content td {
    border-right: 1px solid #4b3c2d !important;
    border-top: 1px solid #4b3c2d;
    border-bottom: 1px solid #4b3c2d !important;
	font-size: 14px;
}
.wpcf7 {
	width: 990px;
	margin: 0 auto;
}


/*contctformラジオぼたん色変更*/
.wpcf7-list-item{
	margin: 0.3em 1em 0 0;
}
.wpcf7-list-item-label {
  cursor: pointer;
  display: flex;
}
/* デフォルトのボタン */
input[type="radio"] {
  opacity: 0; /* デフォルトのボタンを非表示 */
  position: absolute;
}
/* チェック前のボタン */
.formtable .wpcf7-list-item-label::before {
  background: #F5F2EB;
  border: 1px solid #DBCBC7;
  border-radius: 100%; /* ラジオボタンっぽく丸くする */
  content: "";
  height: 1.2em;
  margin-bottom: auto;
  margin-right: .5em;
  margin-top: auto;
  transition: background-color .5s; /* 色をじんわり変化させる */
  width: 1.2em;
}
/* チェック後のボタン */
input[type="radio"]:checked + .wpcf7-list-item-label::before {
  background-color: #CFB390;/* チェック後の中心の色 */
  box-shadow: inset 0em 0 0 3px #F5F2EB; /* 中心の色のスタイル */
}

/*プライバシーポリシー*/
.privacy-policy {
    max-width: 990px;
    margin: 50px auto;
    height: 300px;
    overflow: scroll;
    padding: 25px;
    border: 1px solid #4b3c2d;
    background-color: rgba(255,255,255,0.4);
    line-height: 1.5;
}
.privacy-policy__item p {
    margin-bottom: 5px;
    padding-top: 5px;
}
/*同意チェック*/
.hissu-check {
display: flex;
    justify-content: center;
    margin-bottom: 50px;
}
.hissu-check .wpcf7-list-item-label {
    display: inline-block;
}


.wpcf7-form-control-wrap {
  display: block;
}
.hissu-check .wpcf7-list-item {
  position: relative;
}
.hissu-check .wpcf7-list-item-label {
  cursor: pointer; /* labelにhoverした時にカーソルを表示させる */
  font-size: 16px; /* 項目のフォントサイズ */
}
input[type="checkbox"] {
  opacity: 0; /* デフォルトのチェックボックスを見えなくする */
  position: absolute;
}
.wpcf7-list-item-label::before {
  /* チェックボックスのデザイン */
  border: 1px solid #333;
  content: "";
  display: inline-block;
  height: 15px;
  margin-right: 10px;
  position: relative;
  top: -1px;
  vertical-align: middle;
  width: 15px;
}
input[type="checkbox"]:checked + .wpcf7-list-item-label::after {
  /* チェックアイコン */
  background: url(https://k-design.okatase.com/wp-content/uploads/2023/11/arrow.png) no-repeat center;
  background-size: contain;
  content: "";
  height: 15px;
  left: 0;
  position: absolute;
  top: 6px;
  width: 15px;
}
@media screen and (max-width: 480px) {
	.wpcf7 {
    width: 100%;
}
	.formtable td, .formtable th {
    width: 100%;
    display: block;
}
	.post_content td {
    border-right: 0px solid #4b3c2d !important;
    border-top: 1px solid #4b3c2d;
    border-bottom: 1px solid #4b3c2d !important;
}
	.post_content th {
    border-left: 0px solid #4b3c2d;
    border-top: 0px solid #4b3c2d;
    border-bottom: 0px solid #4b3c2d;	
}
	button, input, select, textarea {
    width: 100%;
}
	tbody {
		border: 1px solid #4b3c2d;		
	}
	.post_content tbody p {
		font-size: 12px !important;
	}
	.wpcf7-form .wpcf7-submit {
    font-size: 16px !important;
    padding: 15px 0px !important;
	}
	.hissu-check {
    margin-bottom: 30px;
}
	.privacy-policy {
    margin: 30px auto;
	}
}

/*フッター*/
.w-beforeFooter {
    margin:0 auto;
}
.foot_box {
	margin-left: calc(-50vw + 50%);
    margin-right: calc(-50vw + 50%);
    background: url(https://k-design.okatase.com/wp-content/uploads/2023/11/570d49c04a40267a624b56299709f009.png);
    padding: 100px 0;
    background-size: cover;
}

.foot_box article {
	max-width: 1014px;
	margin: 0 auto;
}
.foot_box .logo {
	width: 270px;
	margin: 0 auto;
}
.foot_box p {
	text-align: center;
	font-size: 1.2em;
}
.foot_box .flex_box {
	margin: 50px 0 25px 0;
}
a.btn_23 {
	display: block;
    text-align: center;
    vertical-align: middle;
    text-decoration: none;
    width: 46%;
    padding: 1rem 4rem;
    border: 1px solid #000;
    color: #000;
    cursor: pointer;
    position: relative;
    overflow: hidden;
    z-index: 1;
}
a.btn_23::before {
	content: "";
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background-color: #000;
	transform: translateX(-100%);
	transition: all .8s;
	z-index: -1;
}
a.btn_23:hover::before {
	transform: translateX(0);
}
a.btn_23:hover {
	color: #fff;
}
.foot_box .sns {
	margin: 15px 0 0 0;
	justify-content: center;
}
.btn_design {
    font-size: 1em;
    padding: 0 10px;
    text-align: center;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    transition: 0.8s;
}
  
/* マウスオーバー時 */
.btn_design:hover{
      transform: translateY(-5px);
      cursor: pointer;
    }

.l-footer {
    border-top: 2px solid #CFB390;
}

.l-footer__inner {
    border-top: 6px solid #CFB390;
    margin-top: 4px;
}


/*fadein*/
.animateElement {

  -webkit-transform: translateZ(0); /* 動きを滑らかにするおまじないです。使いすぎ注意。 */
　display: none;
  opacity: 0:
}

.animated {
  /* アニメーションのプロパティを指定 */
  animation-name: example;
  animation-duration: 3s;
  /*display: block;*/
  opacity: 1;

}

.animated3 {
  /* アニメーションのプロパティを指定 */
  -webkit-transform: translateZ(0);
  animation-name: example3;
  animation-duration: 1s;
  position: relative;
  display: block;
  opacity: 1;
}

@keyframes example3 {
  from {
    opacity: 0;
    top: 100px;
  }
  to {
    opacity: 1;
    top: 0;
  }
}

@keyframes example {
  from {opacity: 0;}
  to {opacity: 1;}
}


@media screen and (max-width:1440px) {
	.post_content p {
		font-size: 14px;
	}
	.foot_box {
	padding: 100px 0;
}
}
@media screen and (min-width:481px) {
	.sp {
		display: none !important;
	}
}
@media screen and (max-width:480px) {
	.pc {
		display: none !important;
	}
	.foot_box {
    background: url(https://k-design.okatase.com/wp-content/uploads/2023/11/74ac908f12b81dffea3786861fe3aabe.png);
	padding: 50px 15px;
    background-size: contain;
}
	.l-footer {
    border-top: 1px solid #CFB390;
}
	.l-footer__inner {
    border-top: 3px solid #CFB390;
    margin-top: 2px;
}
	.l-footer__foot, .l-footer__widgetArea {
    padding-bottom: 0.5em;
    padding-top: 0.5em;
}
	.l-footer .copyright {
    font-size: 10px;
	}
	.post_content .formtable, .post_content table {
    width: 100% !important;
}
	
	.foot_box .logo {
    width: 200px;
	}
	.foot_box .flex_box {
    margin: 30px 0 0 0;
}
	a.btn_23 {
    width: 100%;
		margin-bottom: 15px;
	}
	.sns {
		text-align: center;
		margin-top: 0 !important;
	}
}
/*古いの*/



.title {
font-size: 50px;
font-weight: bold;
margin-bottom: 0px;
}
/*サービス案内*/

.circle{
	position: relative;
  display: inline-block;
 width: 200px;
    height: 200px;
  border-radius: 50%;
	background-size: contain;
z-index: 0
}
.circle::before{
content: '';
position: absolute;
width: 100%;
height: 100%;
left: 0;
background: inherit;
filter: brightness(65%);
/* 最背面へ */
z-index: -1;
	transition: filter 0.3s ease;
}
.circle:hover::before {
	filter: brightness(100%);
}

.circle span {
	position: absolute;
	display: inline-block;
  left: 0;
  top: 50%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  width :200px;
  text-align:center;
	 font-size: 30px;
	 font-weight: bold;
	color: #ffffff;
	text-shadow: 0 2px 2px #666;
}


.circle1 {
	  background-image: url(https://k-design.okatase.com/wp-content/uploads/2022/07/644cb504d6fe331d25b7ba099705d8a5-e1657899017623.png);
}
.circle2 {
	  background-image: url(https://k-design.okatase.com/wp-content/uploads/2022/07/3747d2cb428fdac932a1350e7dc0e402-e1657899554958.png);
}
.circle3 {
	  background-image: url(https://k-design.okatase.com/wp-content/uploads/2022/07/da28f16b4ecc75bbd1ab82f62b99405d-e1657899604619.png);
}
.circle4 {
	  background-image: url(https://k-design.okatase.com/wp-content/uploads/2022/07/db5b0f208aa88ee3cdd0237cacf7ee7b-e1657899685802.png);
}


/*about*/

.p-top__aboutTitle {
    position: absolute !important;
    top: calc(-92em/208) !important;
    left: calc(100/1150*100%)!important;
    font-size: 208px !important;
    color: #fff !important;
    line-height: 1 !important;
    letter-spacing: .08em !important;
    z-index: 0 !important;
}
.pm-top__linkArrow:before {
    content: "";
    border: calc(2em/16) solid #fff;
    border-radius: 50%;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
.pm-top__link {
    display: inline-flex;
    align-items: center;
    overflow: inherit;
}

#main_content .p-top__aboutTitle {
	 margin:0;
    padding: 0;
font-family: cursive;
font-weight: normal;
}
/*news*/ 
.information_box .p-postList {
	display: flex;
	flex-wrap: wrap;
}
.information_box .p-postList__item {
	width: 30%;
	padding: 75px 10px;
	background: rgba(221, 221, 221, 0.8);
    border-radius: 10px;
	 margin-bottom: 15px !Important;
    margin-right: 15px !Important;
}
.information_box .p-postList__item:first-child {
  margin-left: 280px;
}
.information_box {
	position: relative;
}
.title_sub {
	position: absolute;
    top: 0;
font-size: 40px;
	font-weight: bold;
	padding-top: 50px;
}
.bg {
	width: 780px;
    height: 400px;
    background: #fff;
    border-radius: 10px;
    position: absolute;
    top: 0;
    z-index: -1;
    margin-left: 100px;
	margin-top: 100px;
}

/*投稿*/
.c-postTitle__ttl {
        font-weight: normal;
    }

.thum-shadow {
	width: 800px;
    box-shadow: 0px 0px 15px -5px #777777;
	margin-bottom: 5em;
}
.right-thum {
	margin: 0 0 0 auto;
}
.sp-thum {
	margin-top: 5em;
}
@media screen and (max-width: 480px) {
	.thum-shadow {
	width: 100%;
	}
}