@charset "UTF-8";
/* CSS Document */
/*WordPress対策・全ページ余白なし*/
	* {
		margin: 0;
		padding: 0;
	}
	
	body {
		margin: 0;
		padding: 0;
		color: #696969;
		background: #fff;
		font-family: 'Shippori Mincho', serif, 'Shippori Mincho B1', serif, 'Zen Maru Gothic', serif, 'Shippori Mincho', 'Shippori Mincho B1', 'Zen Maru Gothic', serif;
	}
	
	img {
		vertical-align: bottom; /*下に余白を作らない*/
		max-width: 100%;
		width: 100vw;
	}
	
	p,h1,h2,h3,h4,span {
		font-family:"Noto Sans JP";
	}
	
    ul li{
		list-style: none;
	}

	a {
		text-decoration: none;
		color:#fff;
	}
	
	.wrap {
		overflow: hidden;
	}
	
	/*floatを解除する*/
	.clear {
		clear: both;
	}
	
    .pcbr{
		display: block;
	}
    .spbr{display: none;}

	.all-page {
		position: relative;
		z-index: 1;
		width: 100%;
		height: auto;
	}


/*PC設定*/
@media only screen and (min-width: 769px) {
	.sp{
		display: none;
	}

	/*ヘッダー＆フッター*/
		/*グローバルメニュー*/
		header {
			position:absolute;
			z-index: 104;
			width: 85%;
			height:70px;
			padding: 20px 10% 20px 5%;
			background: rgba(255, 255, 255, 0.3);
		}
		
		#header-content {
			position: relative;
			display: inline-block;
			z-index: 102;
			width: 600px;
			height:auto;
		}

		.header-box{
			position: relative;
			display: inline-block;
			float: right;
			vertical-align: top;
			font-size: 0;
		}
		
	    .head-menu{
			display: inline-block;
			position: relative;
			text-align: center;
			
		}
		
		.head-menu:last-child {
			
		}
	
		.header-content01 {
			display: inline-block;
			position: relative;
			width: 130px;
			padding: 16px 20px;
			color: #15aeec;
			font-size: 18px;
			text-align: center;
		}
	    
	    .header-content01 span{
			display: block;
			font-size: 8px;
	    }
	
	    .header-content01:hover {
			cursor: pointer;
	    }
	
	    .header-content01::after {
			position: absolute;
			bottom: 32px;
			left: 0;
			content: '';
			width: 100%;
			height: 2px;
			background: #000;
			transform: scale(0, 1);
			transform-origin: right top;
			transition: transform .3s;
	    }
	
		#logo {
			position: relative;
			display: inline-block;
			z-index: 102;
			width: 140px;
			height: auto;
			font-size: 0;
			padding: 10px 0;
		}
	
	.btn {
		display: inline-block;
		padding: 0 0 5px;
		position: relative;
	}
	
	.btn:before{
	content: "";
	position: absolute;
	left: 0;
	bottom: -4px;
	width: 100%;
	height: 3px;
	background:rgba(255,255,255,0.5);
	transform: scale(0, 1);
	transition: 0.2s;
	}
	
	.btn:hover:before {
	transform: scale(1);
	}
	
	
	.content{
		width: 80%;
		margin:0 10%;
		padding-top: 80px;
	}
	
	
	/*ボタン*/
	.btn5 {
  position: relative;
  display:block;
  text-align: center;
  margin: 0 auto;
  width: 300px;
  height:50px; 
  border: 1px solid #15aeec;
  background-color: #49c0f0;
  background-image: -webkit-linear-gradient(top, #49c0f0, #2cafe3);
  background-image: linear-gradient(to bottom, #49c0f0, #2cafe3);
  border-radius: 4px;
  font-size: 24px;
  color: #fff;
  line-height: 50px;
  -webkit-transition: none;
  transition: none;
  text-shadow: 0 1px 1px rgba(0, 0, 0, .3);
}
	
.btn5:hover {
  border:1px solid #1090c3;
  background-color: #1ab0ec;
  background-image: -webkit-linear-gradient(top, #1ab0ec, #1a92c2);
  background-image: linear-gradient(to bottom, #1ab0ec, #1a92c2);
}
	
.btn5:active {
  background: #1a92c2;
  box-shadow: inset 0 3px 5px rgba(0, 0, 0, .2);
  color: #1679a1;
  text-shadow: 0 1px 1px rgba(255, 255, 255, .5);
}	
	
	/*キービジュアル*/
		#top-keyvisual {
			position: relative;
			width: 100%;
			height: auto;
			font-size: 0;
		}
		
		.top_m {
		}
		
		#video{
			width: 100%;
		}
		
		.fadein {
			opacity : 0;
			transform : translate(0, 50px);
			transition : all 600ms;
		}
		
		.fadein.scrollin {
			opacity : 1;
			transform : translate(0, 0);
		}
	
		.catch{
			text-align: center;
			font-size: 36px;
			color: #007bc7;
		}
	
	
	
	/*ビジョン*/
	
	.view-content{
		position: relative;
        display: flex;
		justify-content: space-between;
        width: 100%;
        height: auto;
		color: #15aeec;
	}
	
	.vbox{
		width: 20%;
		height: auto;
		border: 6px solid;
        border-radius: 10px;
	}
	
	.vbox img{
		margin-top: 10px;
	}
	
	.vbox h3{
		position: relative;
        display: block;
        text-align: center;
		margin: 10px 0;
	}
	
	.themebox {
		display: flex;
		flex-flow: column;
		width: 45%;
		margin: 20px;
        border-radius: 20px;
        box-shadow: 10px 10px 10px #dcdcdc;
	}
	
	.theme {
		color: #fff;
        font-size: 24px;
        padding: 20px;
        border-radius: 20px 20px 0 0;
	}
	
	.theme_detail{
		position: relative;
		padding: 20px 10px;
	}
	
	.theme_detail h4{
		font-size: 20px;
		margin-bottom: 6px;
	}
	
	.theme_detail img{
		position: absolute;
        top: 50px;
        right: 20px;
        width: 60px;
	}
	
	.t01{
		color: #ea5550;
	}
	
	.tbg01{
		background: #ea5550;
	}
	
	.tbo01{
		border: 1px solid #ea5550;
        border-radius: 0 0 20px 20px;
	}
	
	.t02{
		color: #ed6d46;
	}
	
	.tbg02{
		background: #ed6d46;
	}
	
	.tbo02{
		border: 1px solid #ed6d46;
        border-radius: 0 0 20px 20px;
	}
	
	.t03{
		color: #fdd35c;
	}
	
	.tbg03{
		background: #fdd35c;
	}
	
	.tbo03{
		border: 1px solid #fdd35c;
        border-radius: 0 0 20px 20px;
	}
	
	.t04{
		color: #d1de4c;
	}
	
	.tbg04{
		background: #d1de4c;
	}
	
	.tbo04{
		border: 1px solid #d1de4c;
        border-radius: 0 0 20px 20px;
	}
	
	.t05{
		color: #79c06e;
	}
	
	.tbg05{
		background: #79c06e;
	}
	
	.tbo05{
		border: 1px solid #79c06e;
        border-radius: 0 0 20px 20px;
	}
	
	.t06{
		color: #2cb4ad;
	}
	
	.tbg06{
		background: #2cb4ad;
	}
	
	.tbo06{
		border: 1px solid #2cb4ad;
        border-radius: 0 0 20px 20px;
	}
	
	.t07{
		color: #82cddd;
	}
	
	.tbg07{
		background: #82cddd;
	}
	
	.tbo07{
		border: 1px solid #82cddd;
        border-radius: 0 0 20px 20px;
	}
	
	.t08{
		color: #0075c2;
	}
	
	.tbg08{
		background: #0075c2;
	}
	
	.tbo08{
		border: 1px solid #0075c2;
        border-radius: 0 0 20px 20px;
	}
	
	.t09{
		color: #c7a5cc;
	}
	
	.tbg09{
		background: #c7a5cc;
	}
	
	.tbo09{
		border: 1px solid #c7a5cc;
        border-radius: 0 0 20px 20px;
	}
	
	.t10{
		color: #eb6ea0;
	}
	
	.tbg10{
		background: #eb6ea0;
	}
	
	.tbo10{
		border: 1px solid #eb6ea0;
        border-radius: 0 0 20px 20px;
	}
	
	.profile-link{
	}
	
	/*サービス内容*/
	.item-list{
		text-align: center;
		margin: 0 auto;
		font-size:24px;
	}
	
	.title{
		margin: 50px auto;
		text-align: center;
	}
	
	.sub-title{
		display: block;
		font-size:18px;
		text-align: center;
	}
	
	.service-content{
		margin-top:100px;
	}
	
    .service-heading{
		font-size:24px;
	}
	
	.item{
		vertical-align: top;
		display:inline-block;
		width:24%;
		height:50%;
		margin:0 4%;
		text-align: center;
	}
	
	.item p{
		margin: 10%;
	}
	
	.translation{
		display: block;
		text-align: center;
		font-size: 16px;
	}
	
	.items{
		display: block;
		margin: 0 auto;
	}
	.production-content{
		position: relative;
        display: flex;
        flex-flow: column;
        flex-wrap: wrap;
        width: 820px;
        height: 1450px;
        margin: 20px auto;
	}
	
	.production{
		position: relative;
		display: inline-block;
		margin-top: 70px;
		margin-right: 5%;
		margin-left: 5%;
		width: 40%;
		height: auto;
	}
	
	.production-list{
		margin-top:2%; 
		font-size: 26px;
	}
	
	.duties-content{
		position: relative;
		display:inline-block;
		width: 45%;
		vertical-align:top;
	}
	
	.service-link{

	}
	
	.image-area {
    margin: 40px auto;
    display: flex;
    justify-content: center;
    width: 50%;
    height: auto;
	}
	
	
	/*プロフィール*/
	.profile{
		background:#EEEEEE;
	}
	
	.name{
		font-size:18px;
	}
	.business{
		display: inline-block;
		margin:4%;
		vertical-align:top;
		width: 60%;
		height: 40%;
	}
	
	.profile-hobby{
		position: relative;
	}
	
	.block{
		position: relative;
	}
	
	.travel-hobby{
	   position:absolute;
	   top:50%;
	   left:50%;
	   width:100%;
	   transform: translate(-50%,-50%);
	   text-align: center;
	}
	
	.sports-hobby{
	   position:absolute;
	   top:50%;
	   left:50%;
	   width:100%;
	   transform: translate(-50%,-50%);
	   text-align: center;
	}
	
	.manga-hobby{
	   position:absolute;
	   top:50%;
	   left:50%;
	   width:100%;
	   transform: translate(-50%,-50%);
	   text-align: center;
	}
	
	.hobby{
		font-size:72px;
		font-weight: bold;
	}
	
	.profile-hobby p{
		font-size: 36px;
	}
	
	/*コンタクト*/
	.contact-link{
		margin: 100px auto;
		padding: 125px;
		width: 300px;
		text-align: center;
	}
	
	.contact-content{
		position: relative;
		width: 100%;
		height: 300px;
		background: #EEEEEE;
	}
	
	.contact-form{
	float: center;
	background:#fff;
	text-align: center;
	font-size: 20px;
	width: 500px;
	border:solid 1px orange;
	border-radius: 10px;
	margin-left: 250px;
	margin-top: 50px;
	}

.contact-form span{
	font-size: 30px;
	}	

.contact-box{
	margin-top:50px;	
	}	

.contact-p{
		text-align: center;
	}	
	
.contact-table {
	table-layout: fixed;
	font-size:16px;
	width:70%;
	margin: 0 auto 20px;
}
.contact-table, .contact-table td, .contact-table th {
	word-break: break-all;
	border: 1px solid #ccc;	/*テーブルの枠線の幅、線種、色*/
	padding: 10px;	/*ボックス内の余白*/
}
/*ta1の左側ボックス*/
.contact-table th {
	width:40%;		/*幅*/
	text-align: left;
	font-size:16px;
	color:#fff;
	background:#76DCF9;
}	

.contact-table th span{
  text-align: center;
  font-size:12px;
  box-sizing: border-box;
  border:solid 1px;
  width: 100%;
  margin-right:10px;
  padding:4px 4px;
  background:#ff0000; /* 色変更可能 */
  color: #fff;
	}	
	
.contact-table td{
	width:100%;	
	background: #FAF6E3;
	}
	
.wpcf7 input[name="your-name"],
.wpcf7 input[name="your-email"],
.wpcf7 input[name="your-subject"] {
        width: 100%;
        height: 30px !important;
}
.wpcf7 textarea[name="your-message"] {
        width: 100%;
        height: 350px !important;
}
	
.submit-img {
  text-align: center;
  font-size:20px;
  box-sizing: border-box;
  display: block;
  max-width: 200px;
  width: 100%;
  margin: 0 auto;
  background: #447fff; /* 色変更可能 */
  color: #fff;
  font-weight: bold;
  padding: 13px 10px 10px;
  border-radius: 5px;
  border-bottom: 2px solid rgba(0,0,0,0.3);
}
.submit-img:hover {
  text-align:center;
  opacity: 0.6;
}
.submit-img:active, .button-shadow:focus {
  border-bottom-width: 0;
  margin-top: 2px;
  background: #ff9300; /* 色変更可能 */
}
	
	
}
/*PC設定終了*/
