@charset "utf-8";


.body-index .second-flame-right{
	display:none;
}

.body-index figure{
	margin:0;
}

/*=============================================================*/
/* メインイメージ */
/*=============================================================*/
.eyecatch-img {
	width:100%;
	height:515px;
	background:#fbf6d7;
}
.eyecatch-img-in {
	width:1000px;
	height:515px;
	margin:0px auto;
	position:relative;
}

 @media screen and (max-width: 767px) {
.eyecatch-img {
	width:100%;
	height:350px;
	background:#fbf6d7;
}
}

 @media screen and (max-width: 767px) {
.eyecatch-img-in {
	width:100%;
	height:350px;
	margin:0px auto;
	position:static;
}
}

.eyecatch-img-maincopy {
	width:330px;
	font-size:51px;
	color:#134985;
	position:absolute;
	line-height:1.2em;
	top:0px;
	left:0px;
}

.eyecatch-img-maincopy span {
	font-size:27px;
}

 @media screen and (max-width: 767px) {
.eyecatch-img-maincopy {
	width:100%;
	font-weight:bold;
	font-size:16px;
	color:#134985;
	text-align:center;
	line-height:1.2em;
  margin: 0 0 20px;
  padding-top: 20px;
  position: static;
}

.eyecatch-img-maincopy span {
	font-size:18px;
}

}

.eyecatch-img-subcopy01, .eyecatch-img-subcopy02, .eyecatch-img-subcopy03 {
	font-size:18px;
	color:#FFF;
	font-weight:bold;
	line-height:1.7em;
	text-align:center;
}

 @media screen and (max-width: 767px) {
.eyecatch-img-subcopy01, .eyecatch-img-subcopy02, .eyecatch-img-subcopy03 {
	font-size:12px;
	color:#FFF;
	font-weight:bold;
	line-height:1.6em;
	text-align:center;
}
}

.eyecatch-img-subcopy01 {
	width:183px;
	height:143px;
	background:url(../top/main-img-coment01.png) no-repeat;
	position:absolute;
	padding:40px 0 0 0;
	top:270px;
	left:-20px;
	z-index:1;
}

@media screen and (max-width: 767px) {
.eyecatch-img-subcopy01 {
	width:110px;
	height:110px;
	background:url(../top/main-img-coment01.png) no-repeat;
	-moz-background-size:110px 110px;
	background-size:110px 110px;
	position:absolute;
	padding:25px 0 0 0;
	top:50px;
	left:0px;
	z-index:1;
}
}


.eyecatch-img-subcopy02 {
	width:173px;
	height:133px;
	background:url(../top/main-img-coment02.png) no-repeat;
	position:absolute;
	top:270px;
	left:170px;
	padding:50px 0 0 10px;
}

@media screen and (max-width: 767px) {
.eyecatch-img-subcopy02 {
	width:110px;
	height:105px;
	background:url(../top/main-img-coment02.png) no-repeat;
	-moz-background-size:110px 105px;
	background-size:110px 105px;
	position:absolute;
	top:60px;
	left:33%;
	padding:25px 0 0 5px;
}
}

.eyecatch-img-subcopy03 {
	width:178px;
	height:123px;
	font-size:12px;
	background:url(../top/main-img-coment03.png) no-repeat;
	position:absolute;
	top:270px;
	left:800px;
	line-height:1.9em;
	z-index:1;
	padding:60px 0 0 5px;
}
.eyecatch-img-subcopy03 span {
	font-size:20px;
}

.eyecatch-img-subcopy03 i{
	font-style:normal;
}


@media screen and (max-width: 767px) {
.eyecatch-img-subcopy03 {
	width:31%;
	height:113px;
	font-size:12px;
	background:url(../top/main-img-coment03.png) no-repeat;
	-moz-background-size:119px 113px;
	background-size:119px 113px;
	position:absolute;
	top:50px;
	left:66%;
	line-height:1.6em;
	z-index:1;
	padding:34px 0 8px 5px;
}
.eyecatch-img-subcopy03 span {
	font-size:13px;
}

.eyecatch-img-subcopy03 i{
	display:none;
}

}

.eyecatch-img-tortal {
	position:absolute;
	top:30px;
	left:370px;
}

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

.eyecatch-img-seo {
	width:190px;
	height:244px;
	position:absolute;
	background:url(../top/main-img-seo.png) no-repeat;
	top:25px;
	left:825px;
}

@media screen and (max-width: 767px) {
.eyecatch-img-seo {
	width:119px;
	height:153px;
	position:absolute;
	background:url(../top/main-img-seo.png) no-repeat;
	-moz-background-size:119px 153px;
	background-size:119px 153px;
	top:170px;
	left:31%;
}
}

.eyecatch-img-seo a {
	display:block;
	width:244px;
	height:190px;
}

@media screen and (max-width: 767px) {
.eyecatch-img-seo a {
	display:block;
	width:119px;
	height:153px;
}
}

.eyecatch-img-seo:hover {
	background:url(../top/main-img-seo-over.png) no-repeat;
	background-size:contain;
}

.eyecatch-img-seo span {
	display:none;
}


.eyecatch-img-takeuchi {
	position:absolute;
	top:238px;
	left:-177px;
	z-index:0;
}

@media screen and (max-width: 767px) {
.eyecatch-img-takeuchi {
	position:absolute;
	width:87px;
	height:124px;
	top:190px;
	left:2.5%;
	z-index:0;
}
}

.eyecatch-img-staff1 {
	position:absolute;
	top:238px;
	left:970px;
	z-index:0;
}

@media screen and (max-width: 767px) {
.eyecatch-img-staff1 {
	position:absolute;
	width:87px;
	height:124px;
	top:190px;
	left:72%;
	z-index:0;
}	
}

.eyecatch-bottom {
	width:100%;
	text-align:center;
	font-size:23px;
	color:#FFF;
	background:#000;
	padding:15px 0 15px 0;
	margin:0px;
}

@media screen and (max-width: 767px) {
.eyecatch-bottom {
	width:100%;
	text-align:center;
	font-size:18px;
	color:#FFF;
	background:#000;
	padding:15px 5px;
	box-sizing:border-box;
	margin:0px;
}
}





/*=============================================================*/
/* コンテンツ */
/*=============================================================*/

.listTop1{
	clear:both;
	overflow:hidden;
	width:100%;
    display: -webkit-box;display: -webkit-flex;display: -ms-flexbox;display: flex;
    -webkit-flex-wrap: wrap;flex-wrap:wrap;/*複数行*/
*/}

.listTop1 li{
    list-style: none;
    width: 25%;
	text-align:center;

	/*for background animation*/
	position:relative;
	background: #e5ecf4;
}

.listTop1 li a{
	display:block;
	padding:60px 20px 20px;
	text-decoration:none;
	color:#333;
}

.listTop1 li:before {
	/*for background animation*/
	position: absolute;
	z-index:0;
	top: 0;
	left: 0;
	content: attr(data-text);
	width: 100%;
	height: 100%;
	background: #fff;
	overflow: hidden;
	-webkit-transition: .3s;
	-moz-transition: .3s;
	-ms-transition: .3s;
	-o-transition: .3s;
	transition: .3s;
}
.listTop1 li:nth-child(1):before,
.listTop1 li:nth-child(3):before,
.listTop1 li:nth-child(6):before,
.listTop1 li:nth-child(8):before{
    /*for background animation*/
	background:#fafafa;
}


.listTop1 li:hover:before {
	/*for background animation*/
	height:0;
}

.listTop1 li figure{
	text-align:center;

	/*for background animation*/
	position:relative;
	z-index:1;
}

.listTop1 li img{
	height:110px;
	width:auto;
}

.listTop1 li legend{
	font-size:24px;
	margin:50px auto 30px;

	text-rendering: optimizeLegibility;
	-webkit-font-smoothing: subpixel-antialiased;
	transform: rotate(0.028deg);
	-o-transform: rotate(0.028deg);
	-ms-transform: rotate(0.028deg);
	-moz-transform: rotate(0.028deg);
	-webkit-transform: rotate(0.028deg);
}

.listTop1 li p{
	text-align:left;

	position:relative;
	z-index:1;
}

@media screen and (max-width: 767px) {
.listTop1{
	display:block;
	border-bottom:1px solid #ccc;
}
.listTop1 li{
	display:block;
	width:100%;
	clear:both;
	background:none;
}
.listTop1 li:nth-child(2n-1){
	background:none;
}

.listTop1 li a{
	overflow:hidden;
	border-top:1px solid #ccc;
	padding:20px 2% 20px 3%;

	filter: progid:DXImageTransform.Microsoft.Gradient(StartColorStr='#ffffff',EndColorStr='#f0f0f0');
	background:-moz-linear-gradient(top, #fff, #f0f0f0);
	background:-webkit-linear-gradient(top, #fff, #f0f0f0);
	background:linear-gradient(to bottom, #fff, #f0f0f0);
}
.listTop1 li:before {
	display:none;
}
.listTop1 li a img{
	width:30%;
	height:auto;
	float:left;
}
.listTop1 li figure{
	display:inline;
}
.listTop1 li legend{
	display:block;
	width:65%;
	float:right;
	margin:0;
	line-height:100%;
	font-size:16px;
	text-align:left;
	font-weight:bold;
}
.listTop1 li p{
	width:65%;
	float:right;
	font-size:12px;
	line-height:1.5;
	margin:10px 0 0;
}

/*.listTop1{
	display:block;
	padding:10px 5px;
}
.listTop1 li{
	display:block;
	width:50%;
	float:left;
	padding:5px;
	background:none;
}
.listTop1 li:nth-child(2n-1){
	background:none;
}

.listTop1 li a{
	padding:20px 10px;
	overflow:hidden;
	height:140px;
	border:1px solid #ccc;

	filter: progid:DXImageTransform.Microsoft.Gradient(StartColorStr='#ffffff',EndColorStr='#f0f0f0');
	background:-moz-linear-gradient(top, #fff, #f0f0f0);
	background:-webkit-linear-gradient(top, #fff, #f0f0f0);
	background:linear-gradient(to bottom, #fff, #f0f0f0);

	border-radius:5px;
	-webkit-border-radius:5px;
	-moz-border-radius:5px;
}
.listTop1 li:before {
	display:none;
}
.listTop1 li a img{
	height:50px;
	width:auto;
	margin:0 0 10px;
}
.listTop1 li figure{
}
.listTop1 li legend{
	margin:0;
	font-size:14px;
	line-height:1.5;
}
.listTop1 li p{
	display:none;
}*/
}

/* 実績 */

.topResult{
	clear:both;
	background:#134985;
	color:#fff;
	overflow:hidden;
	padding:10px 0;
}
.topResult a{
	color:#fff;
}

.topResult .ttl3{
	margin-left:4%;
}

@media screen and (max-width: 767px) {
.topResult{
	padding:30px 30px 0;
}
.topResult .ttl3{
	margin:0 0 15px;
	font-size:20px;
}

}


/**/

.boxTop0{
	background:url(../top/2018/top3.jpg) no-repeat #21538a;
	background-size:40%;
	padding:10px 3% 35px 43%;
}

.boxTop0 h2{
	font-size:180%;
	color:#FFF;
	line-height:150%;
}

.boxTop0 p{
	color:#FFF;
	line-height:160%;
}

@media screen and (max-width: 767px) {
.boxTop0{
	background:none;
	background-color: #21538a;
	padding:40px 3% 20px 5%;
}

.boxTop0 h2{
	font-size:120%;
	color:#FFF;
	line-height:130%;
}

.boxTop0 p{
	color:#FFF;
	line-height:160%;
}	
}


.boxTop1{
	background:url(../img/takeuchi1.svg) no-repeat 60px 80px;
	background-size:174px;
	padding:40px 3% 40px 270px;
}

.boxTop1 p{
	line-height:180%;
}

@media screen and (max-width: 767px) {
.boxTop1{
	padding:30px 5% 0;
	background-size:50px;
	background-position:15px 20px;
}

.boxTop1 h2{
	margin-left:60px;
}

.boxTop1 p{
	font-size:14px;
}

}



/**/

.listTop2{
	clear:both;
	border-top:1px solid #ddd;
	border-left:1px solid #ddd;
	border:1px solid #ddd;
	width:94%;
	margin:0 auto;

	border-radius:8px;
	-webkit-border-radius:8px;
	-moz-border-radius:8px;
	overflow:hidden;
}

.listTop2 li{
	width:33.33333%;
	float:left;

	border-top:1px solid #ddd;
	border-left:1px solid #ddd;
	list-style:none;

	-webkit-column-break-inside: avoid;
	-moz-column-break-inside: avoid;
	column-break-inside: avoid;

	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-ms-box-sizing: border-box;
	box-sizing: border-box;
}
.listTop2 li:nth-child(1),
.listTop2 li:nth-child(2),
.listTop2 li:nth-child(3){
	border-top:none;
}
.listTop2 li:nth-child(1),
.listTop2 li:nth-child(4),
.listTop2 li:nth-child(7){
	border-left:none;
}

.listTop2 li a{
	display:block;
	text-decoration:none;
	text-align:center;
	padding:40px 0 0;
	color:#555;
	height:190px;

	-ms-filter:progid:DXImageTransform.Microsoft.Gradient(StartColorStr='#ffffff',EndColorStr='#f0f0f0');
	filter: progid:DXImageTransform.Microsoft.Gradient(StartColorStr='#ffffff',EndColorStr='#f0f0f0');
	zoom:1;
	background:-moz-linear-gradient(top, #fff, #f0f0f0);
	background:-webkit-linear-gradient(top, #fff, #f0f0f0);
	background:linear-gradient(to bottom, #fff, #f0f0f0);
}

.listTop2 li{
	position: relative;
	vertical-align: middle;
}
.listTop2 li:before,
.listTop2 li:after{
	position: absolute;
	left:50%;
	bottom:25px;
	margin: auto;
	content: "";
	vertical-align: middle;
}
.listTop2 li:before{
	width:20px;
	height:20px;
	margin-left:-10px;
	-webkit-border-radius: 50%;
	border-radius: 50%;
	background:#ddd;
}
.listTop2 li:after{
	width:6px;
	height:6px;
	margin-bottom:8px;
	margin-left:-4px;
	border-bottom:2px solid #fff;
	border-right:2px solid #fff;
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
}

.listTop2 li:hover a{
	filter: progid:DXImageTransform.Microsoft.Gradient(StartColorStr='#f7f7f7',EndColorStr='#ffffff');
	background:-moz-linear-gradient(top, #f7f7f7, #ffffff);
	background:-webkit-linear-gradient(top, #f7f7f7, #ffffff);
	background:linear-gradient(to bottom, #f7f7f7, #ffffff);
}
.listTop2 li:hover:before{
	background:#5aa9ec;
}

.listTop2 li figure{
	text-align:center;
}

.listTop2 li figure img{
	height:50px;
	width:auto;
}

.listTop2 li legend{
	margin:10px auto 0;
}

@media screen and (max-width: 767px) {
.listTop2{
	margin-top:30px;
	width:90%;
}
.listTop2 li a{
	font-size:13px;
	padding:15px 0 0;
	height:140px;
	line-height:1.4;
}
.listTop2 li:before,
.listTop2 li:after{
	bottom:10px;
}

.listTop2 li figure img{
	height:40px;
}
}

/**/

.boxTop2{
	clear:both;
	padding:0 3%;
	margin:80px 0;
}

/**/

.boxTop2{
	margin:20px 0;
	padding:0 5%;
}

@media screen and (max-width: 767px) {
.boxTop2{
	margin:30px auto 0;
	background:#f7f7f7;
	padding:30px 5%;
	width:100%;

	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}
.boxTop2 p{
	font-size:14px;
	line-height:1.5;
}
}

/**/

.boxTop3{
	clear:both;
	background:url(../top/2018/img1.jpg) no-repeat 5% 0;
	background-size:40%;
	padding:0 0% 10% 45%;
	overflow:hidden;
	margin:100px 0 80px;
}
@media screen and (min-width:1252px){.boxTop3{background-position:5% 50%;}}

.boxTop3 h2{
	margin-top:0;
}

@media screen and (max-width: 767px) {
.boxTop3{
	margin:30px 0 0;
	padding:0 5%;
	background:none;
}

.boxTop3 h2{
    position: relative;
    width: 100%;
}
.boxTop3 h2:after{
    content:"";
    display: block;
    padding-top: 75%; /* 高さを幅の75%に固定 */
	background:url(../top/2018/img1.jpg) no-repeat 0 0;
	background-size:100%;
	margin-top:10px;
}
.boxTop3 h2:before{
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
}

.boxTop3 h2 br{
	display:none;
}

.boxTop3 p{
	clear:both;
	font-size:14px;
	line-height:1.5;
}

}


/*=============================================================*/
/* アクセス案内 */
/*=============================================================*/

.box-adress {
	padding:30px 0 60px 0;
	clear:both;
}


.box-adress-left {
	float:left;
	width:40%;
	padding:0px;
	margin:0 0 0 5%;
}

@media screen and (max-width: 767px) {
.box-adress-left {
	float:none;
	width:90%;
	padding:0px;
	margin:0 0 0 5%;
}	
}

.box-adressTtl {
	width:130px;
	height:25px;
	font-weight:normal;
	font-size:14px;
	color:#FFF;
	background:#21538a;
	border-top-left-radius: 3px;
	border-top-right-radius: 3px;
	border-bottom-right-radius: 3px;
	border-bottom-left-radius: 3px;
	padding:3px 0 3px 10px;
	margin:0px;

}

.box-adress-right {
	float:right;
	width:50%;
	padding:0px;
	margin:0 0 0 5%;
}

@media screen and (max-width: 767px) {
.box-adress-right {
	float:none;
	width:90%;
	padding:0px;
	margin:0 0 0 5%;
}	
}

.googlemap-link {
	color:#0b7ab3;
	background:url(../top/ac-map.png) left no-repeat;
	padding:0 0 0 50px;
	margin:0px;
}



/*==============================*/
/* デザイナー・アシスタント採用情報 */
/*==============================*/

.boxTop4{
	clear:both;
	padding:0 3%;
	margin:80px 0;
	position:relative;
	padding-top:300px;
}

.boxTop4:before{
	background:url(../top/2018/img2.jpg) no-repeat center top;
	background-size:100%;
	width:100%;
	height:300px;
	position:absolute;
	top:0;
	left:0;
	right:0;
	content:"";
}

/**/

.boxTop4 .list3{
	width:100%;
	margin-top:40px;
}

@media screen and (max-width: 767px) {
.boxTop4{
	margin:50px 0 0;
	padding:0 5%;
}

.boxTop4:before{
	display:none;
}

.boxTop4 h2{
	padding:0;
    position: relative;
}
.boxTop4 h2:after{
    content:"";
    display: block;
    padding-top:30%; /* 高さを幅の75%に固定 */
	background:url(../top/2018/img2.jpg) no-repeat 0 0;
	background-size:100%;
	margin-top:10px;
}
.boxTop4 h2:before{
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
}

.boxTop4 p{
	font-size:14px;
	line-height:1.5;
}

.boxTop4 .list3{
	margin-top:30px;
}

}