/* ====================================================================
  case page style
======================================================================*/
@import url('https://fonts.googleapis.com/css?family=Roboto+Condensed:400,700');

@font-face{font-family:DINOT;font-display:swap;src:url(../fonts/DINOT-Regular.otf) format("opentype");font-weight:400}
@font-face{font-family:DINOT;font-display:swap;src:url(../fonts/DINOT-Bold.otf) format("opentype");font-weight:700}
@font-face{font-family:DINOT;font-display:swap;src:url(../fonts/DINOT-Medium.otf) format("opentype");font-weight:600}

.fnt-10 { font-size: 10px; }
.fnt-12 { font-size: 12px; }
.fnt-14 { font-size: 14px; line-height: 1.8;}
.fnt-16 { font-size: 16px; line-height: 2.0; }

.n540 { display: none; }

body { font-family: 'Roboto Condensed', sans-serif; }

/* ====================================================================
  Main Slickスライダー
======================================================================*/
.mv_slider {
	position: relative;
}

.slick__bg {
    width: 100%;
	height: 100vh;
    background-size: cover;
    background-repeat: no-repeat;
}
.slick__bg01 {
    background-image: url(../images/es/bg_photo1.jpg);
}
.slick__bg02 {
    background-image: url(../images/es/bg_photo2.jpg);
}
.slick__bg03 {
    background-image: url(../images/es/bg_photo3.jpg);
}

@media only screen and (min-width: 480px) and (max-width: 767px) {
	#case .slick__bg {background-position: left 40% top !important;}
}

#case .container { width: 100% !important; position: absolute; max-width: 1200px; top:50%; left:0; right:0; margin: 0 auto; padding: 0; }
@media only screen and (max-width: 540px) {
    #case .container { width: 88% !important; }
}

#case .valign { text-align: center !important; }

@media only screen and (max-width: 768px) {
	#case .container { top: 50%; }
}


/* ====================================================================
  Main
======================================================================*/

.home_head_cd{font-family: 'Roboto Condensed', sans-serif; font-size:54px !important; margin-bottom: 40px !important;}
.home_head_cd.cd-headline{line-height:1.4 !important;}
.hs_cd{ font-family: 'Roboto Condensed', sans-serif; font-size: 24px !important;line-height: 32px!important; font-weight: 400;}

@media only screen and (min-width: 960px) and (max-width: 1199px) {
	.home_head_cd{font-size:40px !important;}
	.home_head_cd.cd-headline{line-height:58px;}
}
@media only screen and (min-width: 768px) and (max-width: 960px) {
	#case .home {background-position: left 40% top !important;}
	.home_head_cd{font-size:44px !important; margin-bottom: 30px !important;}
	.home_head_cd.cd-headline{line-height:38px !important;}
	.hs_cd{ font-size: 18px !important; line-height: 28px!important; }
}
@media only screen and (min-width: 480px) and (max-width: 767px) {
	#case .home {background-position: left 40% top !important;}
	.home_head_cd{font-size:22px !important; margin-bottom: 20px !important;}
	.home_head_cd.cd-headline{line-height:28px;}
	.hs_cd{ font-size: 18px !important; line-height: 28px!important; }	
}


@media only screen and (max-width: 540px) {
	.home_head_cd{font-size:22px !important; margin-bottom: 20px !important;}
	.home_head_cd.cd-headline{line-height:28px;}
	.home_head_cd br{display: none;}
	.hs_cd{ font-size: 16px !important; line-height: 28px!important; }
	.hs_cd br{display: none;}
}

.home-content__btn {
    text-align: center;
    margin-top: 80px;
}
.home-content__btn a {
	color: #fff;
}

.home-content__btn-link {
    display: block;
	font-size: 26px;
	font-weight: 500;
    max-width: 490px;
	background-color: #ec6600;
	border-radius: 10px;
    margin: auto;
    color: #fff;
    text-decoration: none;
    padding: 27px 1px 27px 0;
    box-sizing: border-box;
    position: relative
}

.home-content__btn-link:before {
    content: '';
    display: block;
    position: absolute;
    bottom: 0;
    top: 0;
    right: 35px;
    margin: auto;
    width: 24px;
    height: 1px;
    background: #fff;
}

.home-content__btn-link:after {
    content: '';
	width: 0.45em;
	height: 0.45em;
	border: 1px solid currentColor;
	border-left: 0;
	border-bottom: 0;
	transform: rotate(45deg);
	transform-origin: top right;
	position: absolute;
	top: 50%;
    right: 32px;
    margin: auto;
	/*アニメーションの指定*/
    transition: all .2s linear;
}

@media only screen and (min-width: 600px){
.home-content__btn-link:hover {
	background-color: #ffffff;
	color: #000;
}

.home-content__btn-link:hover:before {
	background: #000;
	width: 27px;
	right: 30px;
}

.home-content__btn-link:hover:after {
	border-color: #000;
	right: 28px;
}
}


@media only screen and (max-width: 896px) {
	#case .container { top:54%; }
	.home_head_cd{font-size:36px !important; margin-bottom: 20px !important;}
	.home-content__btn {margin-top: 40px}
	.home-content__btn-link {
		font-size: 20px;
		font-weight: 500;
		max-width: 420px;
		padding: 18px 1px 18px 0;
	}
}

@media only screen and (max-width: 768px) {
	#case .container { top:50%; }
}

@media only screen and (min-width: 480px) and (max-width: 767px) {
	.home-content__btn-link {
		max-width: 420px;
		font-size: 18px;
		padding: 17px 1px 17px 0;
	}
	.home-content__btn-link:before {
		width: 20px;
		right: 20px;
	}
	.home-content__btn-link:after {
		right: 17px;
	}
}
@media only screen and (max-width: 540px) {
	.home_head_cd{font-size:24px !important; margin-bottom: 20px !important;}
	.home_head_cd br.n540 {display: block;}
	.home-content__btn {margin-top: 30px}
	.home-content__btn-link {
		max-width: 90%;
		font-size: 18px;
		padding: 17px 1px 17px 0;
	}
	.home-content__btn-link:before {
		width: 20px;
		right: 20px;
	}
	.home-content__btn-link:after {
		right: 17px;
	}
}
@media only screen and (max-width: 480px) {
	.home_head_cd{font-size:28px !important; margin-bottom: 20px !important;}
}

@media only screen and (max-width: 400px) {
	.home_head_cd{font-size:26px !important; margin-bottom: 20px !important;}
}





/* ====================================================================
  About
======================================================================*/


#about .container_bk {
	padding: 0 0 140px;
	margin: 0;
	position: relative;
	background: #1b1b1b;
	z-index: 1;
}

@media only screen and (max-width: 896px) {
	#about .container_bk {
		padding: 0 0 80px;
	}
}

@media only screen and (max-width: 480px) {
	#about .container_bk {
		padding: 0 0 30px;
	}
}

.about__marquee {
	position: absolute;
	top:75px;
    --gap: 0.5em;
	color:rgba(0,0,0,.0);
	text-align:center;
	padding: 0;
	-webkit-text-stroke: 1px #393939;
    display: flex;
    font-family: DINOT;
    font-size: 148px;
    font-weight: 700;
    gap: var(--gap);
    letter-spacing: 0;
    line-height: 1;
    margin-top: -22px;
    overflow: hidden;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none
}

.about__marquee-content {
    animation: marquee 40s linear infinite;
    display: flex;
    flex-shrink: 0;
    gap: var(--gap);
    justify-content: space-around;
    min-width: 100%
}

@keyframes marquee {
	0%   { translate: 0; }
	100% { translate: calc(-100% - 1rem); }
}

@media (min-width:897px){
	.about__marquee{font-size:387px;margin-top:-37px}
}

.about_lead {
	font-family: 'Roboto Condensed', sans-serif; 
	position: relative;
	width: 100%;
	max-width:1200px;
	margin: 0 auto;
	padding: 216px 0 26px;
	z-index: 100;
}

.lead-txt {
	font-size: 32px;
	font-weight: 200;
	line-height: 1.8;
	color: #f5f5f5 !important;
}

.about_cont {
	padding: 0 0 48px!important;
	margin:0 auto;
	display: flex;
}

@media (min-width:897px){
	.about_cont {
		padding: 0 0 78px!important;
	}
}


@media only screen and (max-width: 1200px) {
	.about__marquee{font-size:317px;margin-top:-37px}
	.about_lead {
		width: 90%;
		padding: 166px 0 26px;
	}
	.lead-txt {
		font-size: 28px;
	}
}

@media only screen and (max-width: 980px) {
	.about__marquee{font-size:287px;margin-top:-37px}
	.about__marquee {
		top:55px;
	}
	.about_lead {
		padding: 136px 0 26px;
	}
	.lead-txt {
		font-size: 24px;
	}
}


@media only screen and (max-width: 768px) {
	.about__marquee{font-size:220px;margin-top:-27px}
	.about__marquee {
		top:25px;
	}
	.about_lead {
		padding: 106px 0 0;
	}
	.lead-txt {
		font-size: 20px;
	}
}

@media only screen and (max-width: 560px) {
	.about__marquee{font-size:120px;margin-top:0}
	.about_lead {
		padding: 66px 0 0;
	}
	.lead-txt {
		font-size: 18px;
	}
	.about_cont {
		padding: 0 0 28px!important;
	}
}

@media only screen and (max-width: 480px) {
	.lead-txt {
		font-size: 18px;
		line-height: 28px;
	}
}

/* 制作実績 */
.about-results {
	width: 100%;
	max-width:1080px;
	margin: 0 auto;
	display: flex;
	flex-wrap: wrap;
	font-family: 'Roboto Condensed', sans-serif; 
}

.about-results__data { margin: 0;}
.about-results_columns {
	width: 31.3%;
	border: 1px solid #fa9a03;
	margin: 0 1%;
	box-sizing: border-box;
	text-align: center;
	border-radius: 10px;
	position: relative;
	padding-top: 80px;
	padding-bottom: 80px;
}

.about-results__ttl {
	width: 100%;
	color:#fa9a03;
	font-size:22px;
	font-weight: 700;
	margin-top: 10px;
	margin-bottom: 40px;
}
.about-results__ttl span {
	font-size:18px;
}

.about-results__number {
    color: #fa9a03;
    font-family: DINOT,Noto Sans JP,Hiragino Sans,Hiragino Kaku Gothic ProN,ヒラギノ角ゴ ProN,Hiragino Kaku Gothic Pro,ヒラギノ角ゴ Pro,メイリオ,Meiryo,ＭＳ Ｐゴシック,MS PGothic,sans-serif;
    font-size: 82px;
    font-weight: 900;
    letter-spacing: 0;
    line-height: 1
}

.about-results__unit {
	color: #fa9a03;
    font-size: 20px;
    font-weight: 700;
}

.about-results_columns.column01 {
	background: url(../images/es/results_bg01.png) left top no-repeat;
	background-size: 56% auto ;
	background-position: left 50% top 52%;
}
.about-results_columns.column02 {
	background: url(../images/es/results_bg02.png) left top no-repeat;
	background-size: 52% auto ;
	background-position: left 50% top 52%;
}
.about-results_columns.column03 {
	background: url(../images/es/results_bg03.png) left top no-repeat;
	background-size: 52% auto ;
	background-position: left 50% top 52%;
}


@media only screen and (max-width: 1200px) {
	.about-results {
		width: 90%;
	}
}

@media only screen and (max-width: 980px) {
	.about-results_columns {
		padding-top: 67px;
		padding-bottom: 47px;
	}
	.about-results__ttl {
		font-size:18px;
		margin-bottom: 30px;
	}
	.about-results__ttl span {
		font-size:13px;
	}
	.about-results__number {
        font-size:52px;

    }
	.about-results__unit {
		font-size: 18px;
	}
}

@media only screen and (max-width: 768px) {
	.about-results {
		margin: 30px auto 0;
	}
	
	.about-results_columns {
		padding-top: 57px;
		padding-bottom: 37px;
	}

	.about-results__ttl span {
		display: block;
		max-width:0 auto;
	}

	.about-results__ttl {
		font-size:16px;
	}
	.about-results__number {
        font-size:52px;
    }
	.about-results__unit {
		font-size: 14px;
	}
}

@media only screen and (max-width: 540px) {
	.about-results {
		margin: 0 auto 0;
		justify-content: center;
	}
	
	.about-results_columns {
		width: 48% !important;
		margin: 1%;
		padding-top: 30px;
		padding-bottom: 20px;
	}
	.about-results__ttl {
		font-size:12px !important;
		margin-bottom: 20px;
	}

	.about-results__number {
        font-size:40px;
    }
	.about-results_columns.column01 {
		background-size: 66% auto ;
	}
	.about-results_columns.column02 {
		background-size: 66% auto ;
	}
	.about-results_columns.column03 {
		background-size: 66% auto ;
	}
}

/* メッセージ */
.about_message {
	position: relative;
	width: 100%;
	max-width:1200px;
	margin: 0 auto;
	padding: 0;
	z-index: 100;
}

.about_message p {
	font-size:20px;
	line-height: 1.6;
	opacity: 0.6;
	color: #ffffff;
}

.about_index {
	max-width: 1200px;
	margin: 0 auto;
	z-index: 999;
}

@media only screen and (max-width: 1200px) {
	.about_index {
		width: 90%;
    }
	.about_message {
		width: 90%;
	}
	.about_message p br {
		display: none;
	}
}

@media only screen and (max-width: 540px) {
	.about_message p {
		font-size:15px;
	}
}

@media only screen and (max-width: 480px) {
	.about_message p {
		font-size:16px;
	}
}

.top-about-list {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    justify-content: center;
}

@media (min-width: 897px) {
    .top-about-list {
        gap:8px;
    }
}

.top-about-list__item {
    width: 100%;
	position: relative;
	background: #333;
}

@media (max-width: 896px) {
    .top-about-list__item {
        width:calc(50% - 8px)
    }
}

@media (min-width: 897px) {
    .top-about-list__item {
        width:calc(33.33% - 12px)
    }
}

@media (max-width: 540px) {
    .top-about-list__item {
        width:calc(100% - 8px)
    }
}

.about-card {
    color: #fff;
    display: flex;
    flex-direction: column;
    height: 100%;
    overflow: hidden;
    padding: 20px 20px 50px;
    position: relative;
    transform: translateZ(0)
}

@media (min-width: 897px) {
    .about-card {
        min-height: 615px;
        padding: 20px
    }
}

@media (max-width: 540px) {
	.about-card {
		padding: 10px 14px 50px;
	}
}

.about-card__bg {
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    transition: transform .3s;
    width: 100%;
    will-change: transform
}

.about-card__bg img {
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    width: 100%;
	opacity: 0.5;
}

.about-card__header {
    display: flex;
	height:60px;
    flex-direction: column;
    justify-content: flex-end;
    position: relative;
    z-index: 1;
}

@media (min-width: 897px) {
    .about-card__header {
        height:24%;
    }
}

.about-card__ttl-midashi {
	position: absolute;
	top:5px;
    font-size: 20px;
    font-weight: 700;
    line-height: 1.35
}

@media (min-width: 897px) {
    .about-card__ttl-midashi {
        font-size:22px;
        margin-bottom: 12px
    }
}

.about-card__ttl-su {
	position: absolute;
	top:-6px;
	font-size: 152px !important;
	right: -34px;
    font-family: DINOT,Noto Sans JP,Hiragino Sans,Hiragino Kaku Gothic ProN,ヒラギノ角ゴ ProN,Hiragino Kaku Gothic Pro,ヒラギノ角ゴ Pro,メイリオ,Meiryo,ＭＳ Ｐゴシック,MS PGothic,sans-serif;
    font-size: 82px !important;
}

.about-card__ttl-su.no2,
.about-card__ttl-su.no3
 {
	right: -24px !important;
}

@media (min-width: 897px) {
    .about-card__ttl-su {
		top:12px;
        font-size: 152px !important;
		right: -44px;
    }
	.about-card__ttl-su.no2,
	.about-card__ttl-su.no3{
		right: -28px !important;
	}
}

.about-card__body {
    align-items: center;
    position: relative;
    z-index: 1;
	text-align: center !important;
	margin-bottom: 0;
}
.about-card__body p {
	font-size: 60px;
	font-family: DINOT,Noto Sans JP,Hiragino Sans,Hiragino Kaku Gothic ProN,ヒラギノ角ゴ ProN,Hiragino Kaku Gothic Pro,ヒラギノ角ゴ Pro,メイリオ,Meiryo,ＭＳ Ｐゴシック,MS PGothic,sans-serif;
    letter-spacing: .05em;
	line-height: 1.1;
	padding: 0;
	font-weight: 700 !important;
}

.about-card__body span {
	font-weight: normal !important;
	display: block;
	font-size: 18px;
	margin-top: 0;
}

.about-card__icon {
    text-align: center;
    position: relative;
    z-index: 1;
	margin-bottom: 16px;
}
.about-card__icon img {
    max-width: 46px;
}

.about-card__client {
    text-align: center;
    font-size: 14px;
    line-height: 1.4;
	font-weight: 500;
    position: relative;
    z-index: 1;
}

@media (min-width: 897px) {
	.about-card__icon img {
		max-width: 60px;
	}
	.about-card__body { margin-bottom: 10px; }
	.about-card__body p {
		font-size: 75px;
        line-height: 1.2;
		margin-top: 10px;
		letter-spacing: .05em;
	}
	.about-card__icon {
		margin-bottom: 42px;
	}
	.about-card__client {
		font-size: 16px;
		line-height: 1.6;
	}
}

@media (max-width: 540px) {
	.about-card__header {
		height:58px;
	}
	.about-card__ttl-su {
		top:6px;
		right: -28px;
    }
	.about-card__ttl-su.no2,
	.about-card__ttl-su.no3{
		right: -18px !important;
	}

	.about-card__ttl-midashi {
        font-size:18px;
        margin-bottom: 0px
    }
	.about-card__body {
        font-size: 48px;
        line-height: 1.875;
        padding-top: 0;
    }
	.about-card__body span {
		margin-top: 10px;
	}
}

.about-card__overlay {
    align-items:center;
	display: flex;
	height: 100%;
	justify-content: center;
	left: 0;
	opacity: 1;
	pointer-events: none;
	position: absolute;
	top: 0;
	transition: opacity .3s;
	width: 100%;
	z-index: 2
}

.about-card__overlay span {
    align-items: center;
    border: 1px solid #fff;
    border-radius: 50%;
    display: flex;
    height: 46px;
    justify-content: center;
    width: 46px;
	margin-top: auto;
	margin-bottom: 10px;
	position: relative;
}

.about-card__overlay span:before {
    background: #fff;
    content: "";
    display: block;
    height: 18px;
    width: 2px
}

.about-card__overlay span:after {
    content: '';
	width: 0.65em;
	height: 0.65em;
	border: 0.1em solid currentColor;
	border-top: 0;
	border-right: 0;
	transform: rotate(-45deg);
	transform-origin: bottom left;
	position: absolute;
	left: 50%;
	bottom: 0.8em;
	box-sizing: border-box;
}

@media (min-width: 897px) {
	.about-card__overlay span {
		height: 66px;
		width: 66px;
		margin-bottom: 40px;
	}
	.about-card__overlay span:before {
		height: 23px;
		width: 2px
	}
	.about-card__overlay span:after {
		width: 0.85em;
		height: 0.85em;
		left: 50%;
		bottom: 1.2em;
	}
    .about-card:hover .about-card__bg {
        transform:scale(1.2)
    }

    .about-card:hover .about-card__overlay {
        opacity: 1
    }

	.about-card:hover .about-card__bg img {
		opacity: 0.8;
    }
}

@media (max-width: 540px) {
	.about-card__overlay span {
		height: 36px;
		width: 36px;
	}
	.about-card__overlay span:before {
		height: 14px;
		width: 2px
	}
	.about-card__overlay span:after {
		width: 0.55em;
		height: 0.55em;
		bottom: 0.6em;
	}
}

/* スライダー */
.case-ph_slider {
	padding: 0;
	margin: 100px 0 100px;
}


@media (max-width: 896px) {
	.case-ph_slider {
		margin: 60px 0 60px;
	}
}
@media (max-width: 486px) {
	.case-ph_slider {
		margin: 50px 0 30px;
	}
}

.slick__inner {
	width: min(100%, 1200px);
	margin: 0 auto;
	padding: 0;
}

.slick__container {
	position: relative;
	/* インナー幅から片側をはみ出させる */
	width: calc(100% + (100vw - 100%) / 2);
	/* / インナー幅から片側をはみ出させる */
}

.slick__images {
	padding: 0 0 80px 60px;
}

.slick__images:first-child {
	padding: 0 0 80px 0;
}

.slick__prev,
.slick__next {
	position: absolute;
	bottom:0;
	z-index: 1;
	width: 122px;
	height: 122px;
	border-radius: 50%;
	border: 1px solid #999494;
	background: none;
}

.slick__prev {
	opacity: .5;
	/* (インナー幅の右端) + (画像のマージン + ボタンの大きさ + ボタンとの間隔) */
	right: calc((100vw - 100%) + (20px + 122px));
}
.slick__next {
	/* (インナー幅の右端) + (画像のマージン) */
	right: calc((100vw - 100%) + (0px));
}

.slick__prev:before {
	position: absolute;
	top: 50%;
	left: 44%;
	width: 14px;
	height: 14px;
	border-top: 2px solid #fff;
	border-right: 2px solid #fff;
	opacity: 1;
	content: '';
}
.slick__next:before {
	position: absolute;
	top: 50%;
	left: 56%;
	width: 14px;
	height: 14px;
	border-top: 2px solid #fff;
	border-right: 2px solid #fff;
	opacity: 1;
	content: '';
}

.slick__prev:before {
	transform: translate(-25%, -50%) rotate(-135deg);
}

.slick__next:before {
	transform: translate(-75%, -50%) rotate(45deg);
}

.slick__prev:after {
    content: '';
    display: block;
    position: absolute;
    bottom: 0;
    top: 0;
    right: 40%;
    margin: auto;
    width: 24px;
    height: 2px;
    background: #fff;
}

.slick__next:after {
    content: '';
    display: block;
    position: absolute;
    bottom: 0;
    top: 0;
    left: 40%;
    margin: auto;
    width: 24px;
    height: 2px;
    background: #fff;
}

.slick__image {
	position: relative;
	width: 625px;
	margin-right: 60px;
}

.slick__image:before {
	display: block;
	padding-top: calc((2 / 3) * 100%);
	content: '';
}

.slick__image img {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.slick-num {
	position: absolute;
	top: -30px;
	left: 0;
	color: #fff;
}

.slick-num span {
	font-size: 16px;
}
.now-count {
	opacity: 1;
}
.all-count {
	opacity: .5;
}


@media only screen and (max-width: 1200px) {
	.slick__inner {
		width: min(90%, 1200px);
	}
}

@media only screen and (max-width: 896px) {
	.slick__images {
		padding: 0 0 60px 40px;
	}
	
	.slick__images:first-child {
		padding: 0 0 60px 0;
	}
	.slick__prev,
	.slick__next {
		bottom: 0;
		width: 82px;
		height: 82px;
	}
	
	.slick__prev {
		right: calc((100vw - 100%) + (14px + 82px));
	}
	
	.slick__next {
		right: calc((100vw - 100%) + (0px));
	}
	
	.slick__prev:before {
		left: 44%;
		width: 12px;
		height: 12px;
		border-top: 2px solid #fff;
		border-right: 2px solid #fff;
	}
	.slick__next:before {
		left: 58%;
		width: 14px;
		height: 14px;
	}
	
	.slick__prev:after {
		right: 37%;
		width: 20px;
		height: 2px;
	}
	
	.slick__next:after {
		left: 40%;
		width: 20px;
		height: 2px;
	}
	
	.slick__image {
		width: 425px;
		margin-right: 40px;
	}
}

@media only screen and (max-width: 560px) {
	.slick__images {
		padding: 0 0 40px 40px;
	}
	
	.slick__images:first-child {
		padding: 0 0 40px 0;
	}
	
	.slick__prev,
	.slick__next {
		bottom: 0;
		width: 62px;
		height: 62px;
	}
	
	.slick__prev {
		right: calc((100vw - 100%) + (14px + 62px));
	}
	
	.slick__next {
		right: calc((100vw - 100%) + (0px));
	}
	.slick__prev:before {
		left: 44%;
		width: 10px;
		height: 10px;
		border-top: 2px solid #fff;
		border-right: 2px solid #fff;
	}
	.slick__next:before {
		left: 58%;
		width: 12px;
		height: 12px;
	}
	
	.slick__prev:after {
		right: 38%;
		width: 14px;
		height: 2px;
	}
	
	.slick__next:after {
		left: 40%;
		width: 14px;
		height: 2px;
	}
	.slick__image {
		width: 285px;
		margin-right: 40px;
	}
}

.case-img__main {
	margin: 30px 0 20px;
}

.siteLink { font-size:16px; text-align:right; position: relative; line-height: 1.6; }
.siteLink:after {
	content: '';
	display: inline-block;
	width: 16px;/*画像の幅*/
	height: 16px;/*画像の高さ*/
	background-image: url(../images/case/link.png);
	background-size: contain;
	vertical-align: middle;
	margin-bottom: 6px;
	margin-left: 6px;
}

.siteLink.wh a { color:#fff;}
.siteLink.wh:after { background-image: url(../images/case/link_wh.png); }

@media (min-width: 897px) {
	.siteLink a:hover{
		color: #ec6600;
	}
	.siteLink.wh a:hover{
		color: #ec6600;
	}
	.siteLink:hover:after {
		background-image: url(../images/case/link_on.png);
	}
}

@media only screen and (max-width: 560px) {
	.case-img__main {
		margin: 20px 0 20px;
	}
	.siteLink { font-size:14px; line-height: 1.4; margin-bottom: 20px;}
	.siteLink:after {
		width: 14px;/*画像の幅*/
		height: 14px;/*画像の高さ*/
	}
}

.case-block__detail {
	border-top: 1px solid #dcdee1;
	padding: 52px 0;
	display: flex;
}

.case-block__detail .detail_img {
	width: 40%;
	max-width: 516px;
	margin-right: 45px;
	overflow: hidden;
}

@media (min-width: 897px) {
	.case-block__detail .detail_img img {
		height: auto;
		transition: transform .6s ease;
		width: 100%;
	}
	.case-block__detail .detail_img:hover img {
		transform: scale(1.1);
	}
}

.case-block__detail .detail_txt {
	width: 60%;
}
.case-block__detail .detail_txt h4 {
	font-size: 20px;
	margin-bottom: 20px;
}
.case-block__detail .detail_txt p {
	font-size: 16px;
	line-height: 2.0;
	margin-bottom: 0;
}

.case-block__detail .detail_txt div {
	margin-bottom: 20px;
	font-size: 20px;
}

.case-block__detail .detail_txt div span {
	background: #f6f4f5;
	padding: 10px 20px;
	border-radius: 40px;
	margin-right: 10px;
	font-size: 14px;
	font-weight: bold;
}

@media only screen and (max-width: 896px) {
	.case-block__detail .detail_img {
		width: 34%;
		margin-right: 25px;
	}
	.case-block__detail .detail_txt {
		width: 66%;
	}
	.case-block__detail .detail_txt h4 {
		font-size: 18px;
		line-height: 1.6;
	}
	.case-block__detail .detail_txt p {
		font-size: 14px;
		line-height: 1.8;
	}
	.case-block__detail .detail_txt div {
		margin-bottom: 14px;
		font-size: 16px;
	}
	.case-block__detail .detail_txt div span {
		padding: 8px 14px;
		font-size: 13px;
	}
}

@media only screen and (max-width: 560px) {
	.case-img__main {
		margin: 20px 0 10px;
	}
	.siteLink { font-size:14px; line-height: 1.4;}
	.siteLink:after {
		width: 14px;/*画像の幅*/
		height: 14px;/*画像の高さ*/
	}
	.case-block__detail {
		padding: 32px 0 22px;
		display: block;
	}
	
	.case-block__detail .detail_img {
		width: 100%;
		margin-right: 0;
		margin-bottom: 20px;
	}
	.case-block__detail .detail_txt {
		width: 100%;
	}
	.case-block__detail .detail_txt div {
		margin-bottom: 16px;
		font-size: 15px;
	}

}



/* ====================================================================
  SERVICE
======================================================================*/
#service .container_w {  background:#f5f5f5; }
.service {
	padding: 100px 0 !important;
	max-width:1200px;
	margin:0 auto;
}
.service h1 { font-size: 14px; font-weight: normal; text-align: center;line-height: 1.0!important; margin-bottom:64px; }
.service h1 span { font-family: 'Roboto Condensed', sans-serif; font-size: 32px !important; font-weight: 700; }

.service-block { 
	width:100%;
	padding:0;
	background: url("../images/case/sv_dotline_long.png") no-repeat center bottom 140px;
}
.service-block .block-left {
	width:100%;
	float:left;
	padding-right: 60%;
}
.service-block .block-right {
	width:100%;
	float:right;
	padding-left: 60%;
}

.service-block h1 { margin:0 0 20px; }
.service-block h1 span {
	display:inline-block;
	font-size: 16px !important;
	font-weight:bold;
}
.service-block h1 span.number {
	width:1.8em;
	border-radius: 50%;
	font-size: 32px !important;
	line-height: 1.8em;
	padding-top: 0.05em;
	padding-left: 0.05em;
	padding-right: 0.05em;
	font-family: 'Roboto Condensed', sans-serif;
	font-weight: 700;
	color: #fff;
	background: #1c1c1c;
	margin-right:10px;
	text-align:center !important;
}

/* left */
.service-block .block-left h1,.service-block .block-left p {
	text-align:left !important;
}
.service-block .block-left p {
	padding-bottom:40px;
}

/* right */
.service-block .block-right h1,.service-block .block-right p {
	text-align:left !important;
}
.service-block .block-right p {
	padding-bottom:40px;
}


/* bg */
.service-block .block-left.bg01 {
	background: url("../images/es/sv_ico1.png") no-repeat center top;
	background-size:124px auto;
}
.service-block .block-right.bg02 {
	background: url("../images/es/sv_ico2.png") no-repeat center top;
	background-size:124px auto;
}
.service-block .block-left.bg03 {
	background: url("../images/es/sv_ico3.png") no-repeat center top;
	background-size:124px auto;
}
.service-block .block-right.bg04 {
	background: url("../images/es/sv_ico4.png") no-repeat center top;
	background-size:124px auto;
}
.service-block .block-left.bg05 {
	background: url("../images/es/sv_ico5.png") no-repeat center top;
	background-size:124px auto;
}
.service-block .block-right.bg06 {
	background: url("../images/es/sv_ico6.png") no-repeat center top;
	background-size:124px auto;
}
.service-block .block-left.bg07 {
	background: url("../images/es/sv_ico7.png") no-repeat center top;
	background-size:124px auto;
}
.service-block .block-right.bg08 {
	background: url("../images/es/sv_ico8.png") no-repeat center top;
	background-size:124px auto;
}
.service-block .block-left.bg09 {
	background: url("../images/es/sv_ico9.png") no-repeat center top;
	background-size:124px auto;
}
.service-block .block-right.bg10 {
	background: url("../images/es/sv_ico10.png") no-repeat center top;
	background-size:124px auto;
}

.service-block .block-left.mb p,.service-block .block-right.mb p {
	margin-bottom:30px;
}

.service-block .block-right.mb2 p {
	margin-bottom:60px;
}

.service .bottom-txt { text-align: center; font-size: 12px; }

@media only screen and (max-width: 1200px) {
	.service {
		padding: 80px 5% !important;
	}
}

@media only screen and (max-width: 960px) {
	.service {
		padding: 60px 5% !important;
	}
	
	.service h1 { margin-bottom:44px; }
	.service-block h1 { margin:0 0 20px; }
	
	.service-block .block-left.bg01,
	.service-block .block-right.bg02,
	.service-block .block-left.bg03,
	.service-block .block-right.bg04,
	.service-block .block-left.bg05,
	.service-block .block-right.bg06,
	.service-block .block-left.bg07,
	.service-block .block-right.bg08,
	.service-block .block-left.bg09,
	.service-block .block-right.bg10 {
		background-size:104px auto;
	}
	
	.service-block h1 span.number {
		font-size: 26px !important;
	}
	
}

@media only screen and (max-width: 896px) {
	.service-block { 
		background: url("../images/case/sv_dotline_long.png") no-repeat center bottom 10em;
	}
}

@media only screen and (max-width: 768px) {
	
	.service h1 { margin-bottom:34px; }
	.service-block h1 { margin:0 0 20px; }
	
	.service-block { 
		background: url("../images/case/sv_dotline_long.png") no-repeat left 38px bottom 12em;
	}
	
	.service-block .block-left {
		width:100%;
		float:none;
		padding-left: 120px;
		padding-right: 0;
		padding-top: 10px;
	}
	.service-block .block-right {
		width:100%;
		float:none;
		padding-left: 120px;
	}
	
	.service-block .block-left p,.service-block .block-right p {
		padding-bottom:20px;
	}
	
	.service-block .block-left.bg01,
	.service-block .block-right.bg02,
	.service-block .block-left.bg03,
	.service-block .block-right.bg04,
	.service-block .block-left.bg05,
	.service-block .block-right.bg06,
	.service-block .block-left.bg07,
	.service-block .block-right.bg08,
	.service-block .block-left.bg09,
	.service-block .block-right.bg10 {
		background-position:left top;
		background-size:84px auto;
	}
	
	
	.service-block h1 span.number {
		font-size: 22px !important;
	}
	
	.service-block .block-left.mb p,.service-block .block-right.mb p {
		margin-bottom:20px;
	}

	.service-block .block-right.mb2 p {
		margin-bottom:30px;
	}
}

@media only screen and (max-width: 480px) {
	.service {
		padding: 40px 5% !important;
	}
	.service-block { 
		background: url("../images/case/sv_dotline_long.png") no-repeat left 26px bottom 8em;
	}
	
	.service-block .block-left p,.service-block .block-right p {
		padding-bottom:10px;
	}

	.service-block h1 { margin:0 0 10px; }
	
	.service-block h1 span {
		font-size: 14px !important;
	}
	.service-block .block-left.bg01,
	.service-block .block-right.bg02,
	.service-block .block-left.bg03,
	.service-block .block-right.bg04,
	.service-block .block-left.bg05,
	.service-block .block-right.bg06,
	.service-block .block-left.bg07,
	.service-block .block-right.bg08,
	.service-block .block-left.bg09,
	.service-block .block-right.bg10 {
		background-size:64px auto;
	}
	
	.service-block h1 span.number {
		font-size: 18px !important;
	}
	.service-block .block-left {
		padding-left: 80px;
	}
	.service-block .block-right {
		padding-left: 80px;
	}
}

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

	.service-block { 
		background: url("../images/case/sv_dotline_long.png") no-repeat left 22px bottom 7em;
	}
	.service-block h1 span {
		font-size: 12px !important;
	}
	
	.service-block h1 { margin:0 0 10px; }
	
	.service-block .block-left.bg01,
	.service-block .block-right.bg02,
	.service-block .block-left.bg03,
	.service-block .block-right.bg04,
	.service-block .block-left.bg05,
	.service-block .block-right.bg06,
	.service-block .block-left.bg07,
	.service-block .block-right.bg08,
	.service-block .block-left.bg09,
	.service-block .block-right.bg10 {
		background-size:54px auto;
	}
	.service-block .block-left {
		padding-left: 70px;
	}
	.service-block .block-right {
		padding-left: 70px;
	}
	
	.service-block .block-left.mb p,.service-block .block-right.mb p {
		margin-bottom:10px;
	}

	.service-block .block-right.mb2 p {
		margin-bottom:30px;
}
}


/* ====================================================================
  CONTACT
======================================================================*/
.contact {
	padding: 100px 0 !important;
	max-width:1200px;
	margin:0 auto;
}
.contact h1 { font-size: 14px; font-weight: normal; text-align: center;line-height: 1.0!important; margin-bottom:64px; }
.contact h1 span { font-family: 'Roboto Condensed', sans-serif; font-size: 32px !important; font-weight: 700; }
.contact .lead { font-size: 14px; text-align: center;}
.contact .tel { font-family: 'Roboto Condensed', sans-serif; font-size: 32px !important; font-weight: 700; text-align: center;}

.contact .btn {
	width: 483px;
	margin: 40px auto 40px;
}

.contact .btn a {
	display: block;
	color:#fff;
	font-weight: bold;
	font-size: 18px;
	padding: 0;
	text-align: center;
	line-height:58px; 
	background: #333333;
}

.contact .btn a:hover {
	background: #999999;
}

@media only screen and (max-width: 960px) {
	.contact {
		padding: 60px 5% !important;
	}
	.contact h1 { margin-bottom:44px; }
}

@media only screen and (max-width: 768px) {
	.contact h1 { margin-bottom:34px; }
	.contact .btn {
		margin: 30px auto 30px !important;
	}
	.contact .btn a:hover {
		background: #333333;
	}
}

@media only screen and (max-width: 670px) {
	.contact .btn { margin-bottom: 60px; }
	
}

@media only screen and (max-width: 540px) {
	.contact .btn {
		width: 80%;
	}

	.contact .btn a {
		line-height:48px; 
	}
}

@media only screen and (max-width: 480px) {
	.contact {
		padding: 40px 5% !important;
	}
	.contact .lead { text-align: left; }
	.contact .btn {
		width: 100%;
	}
	.contact .btn a {
		font-size: 16px;
	}
	.contact .tel { font-size: 26px !important;}
}

@media only screen and (max-width: 380px) {
	.contact .fst br {
		display: none;
	}
}