@charset "utf-8";

.pc {
	display:block;
}
.sp {
	display:none;
}

.center {
	max-width: 1240px;
	width: 100%;
	text-align: center;
	padding: 0 20px;
	margin: 0 auto;
}

section h1 img {
	width: 245px;
	height: auto;
}
section h1::after {
    display:none;
}

section .lead {
	margin: 0 auto 130px;
}
article h2 {
	max-width: 1240px;
	width: 100%;
	text-align: center;
  font-size: 3.6rem;
  line-height: 1.0;
	padding: 0 20px;
  margin: 0 auto 40px;
}

.cont1 {
	width: 100%;
	margin-bottom: 100px; 
/*	height: 44.8vw; */
/*		background: url(../img/marketing/cont1_bg.jpg) no-repeat bottom center; */
	background-size: 100% auto;
}

.cont2 {
	width: 100%;
	height: 34.7vw;
	background: url(../img/marketing/cont2_bg.jpg) no-repeat top center;
	background-size: 100% auto;
	margin: 0 auto 40px;
}
.cont3 {
	margin: 0 auto 200px;
}
.cont3 ul {
	width: 100%;
	box-sizing: border-box;
	padding: 0 50px;
}
.cont3 ul li {
	width: 50%;
	float:left;
	box-sizing: border-box;
}
.cont3 ul li:nth-child(1) {
	padding: 0 47px 0 0;
}
.cont3 ul li:nth-child(2) {
	padding: 0 0 0 47px;
}
.cont3 ul li h3 {
	width: 100%;
	font-size: 3.5rem;
	box-sizing: border-box;
	padding: 0 6.7% 15px;
	margin: 0 auto 26px;
	border-bottom: solid 1px #000;
}
.cont3 ul li p {
	padding: 0 6.7%;
}
.cont3 ul li p span {
	font-size: 2.4rem;
}

.cont4, .cont5 {
	width: 100%;
	max-width: 1096px;
	margin: 0 auto;
}
.cont4 img, .cont5 img {
	width: 450px;
	height: auto;
}
.cont4 .txtWrap p {
	width: 100%;
	margin: 0 auto;
	padding: 0 12.3%;
}
.cont5 .txtWrap p {
	width: 100%;
	box-sizing: border-box;
	padding: 0 12.3%;
}
.cont4 .txtWrap h3, .cont5 .txtWrap h3 {
	font-size: 3.5rem;
}
.cont4 img {
	float: right;
}
.cont4 .txtWrap {
	float: left;
	width: 100%;
	margin: 0 -450px 0 0;
	padding: 0 450px 0 0;
}
.cont4 .txtWrap h3 {
	width: 100%;
	margin: 44px auto 26px;
	padding: 0 12.3% 15px;
	border-bottom: solid 1px #000;
}
.cont4 .txtWrap span {
	font-size: 2.4rem;
}
.cont5 ul {
	float: left;
	width: 448px;
}
.cont5 ul li {
	position: relative;
}
.cont5 ul li img {
	width: 100%;
	height: auto;
	vertical-align: top;
}
/*
.cont5 img {
	float: left;
}*/
.cont5 .txtWrap {
	float: right;
	width: 100%;
	margin: 0 0 0 -450px;
	padding: 0 0 0 450px;
}
.cont5 .txtWrap span {
	font-size: 2.4rem;
}

.cont5 .txtWrap h3 {
	width: 100%;
	box-sizing: border-box;
	margin: 110px 0 26px;
	padding: 0 12.3% 15px;
	border-bottom: solid 1px #000;
}

.cont6 {
	width: 100%;
	height: 210px;
	max-width: 900px;
	box-sizing: border-box;
	margin: 148px auto 0;
	padding: 110px 0 0;
	position: relative;
}
.cont6 a {
	display: inline-block;
	padding: 0 0 0 18px;
	position: relative;
}
.cont6 a::before {
	content:"";
	width: 11px;
	height: 11px;
	margin: auto 0;
    border-left: #000 1px solid;
    border-bottom: #000 1px solid;
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
    position: absolute;
    top:0;
    bottom:0;
    left:0;
}
.cont6 img {
	width: 245px;
	height: auto;
	margin: 0 auto;
	position: absolute;
	top:0;
	left:0;
	right:0;
	z-index:11;
}
.footerLink {
	width: 100%;
	max-width: 900px;
	margin: 0 auto 84px;
}
.footerLink li {
	width: 25%;
	float: left;
	position: relative;
}
.footerLink li a {
	display: block;
}
.footerLink li img {
	width: 100%;
	height: auto;
}

@media screen and (max-width: 1000px) {
	.cont3 {
		margin: 0 auto 200px;
	}
	.cont3 ul {
		width: 100%;
		box-sizing: border-box;
		padding: 0 20px;
	}
	.cont3 ul li {
		width: 50%;
		float:left;
		box-sizing: border-box;
	}
	.cont3 ul li:nth-child(1) {
		padding: 0 30px 0 0;
	}
	.cont3 ul li:nth-child(2) {
		padding: 0 0 0 30px;
	}
	.cont3 ul li h3 {
		width: 100%;
		font-size: 3.5rem;
		box-sizing: border-box;
		padding: 0 6.7% 20px;
		border-bottom: solid 1px #000;
	}
	.cont3 ul li p {
		padding: 0 6.7%;
	}
	.cont3 ul li p span {
		font-size: 2.4rem;
	}
}

@media screen and (max-width: 940px) {
	.cont4 img, .cont5 img {
		width: 300px;
		height: auto;
	}
	.cont4 .txtWrap {
		float: left;
		width: 100%;
		margin: 0 -300px 0 0;
		padding: 0 300px 0 0;
	}
	.cont3 ul li h3 {
	    margin: 0 auto 36px;
		padding: 0 6.7% 20px;
	}
	.cont4 .txtWrap h3 {
		width: 100%;
		margin: 44px auto 36px;
		padding: 0 12.3% 20px;
	}
	.cont5 img {
		float: left;
	}
	.cont5 .txtWrap {
		margin: 0 0 0 -300px;
		padding: 0 0 0 300px;
	}
	.cont5 .txtWrap h3 {
		margin: 110px 0 36px;
		padding: 0 12.3% 20px;
		border-bottom: solid 1px #000;
	}
}
@media screen and (max-width: 940px) {
	.cont5 ul {
		width: 300px;
	}
	.cont6 {
		margin: 148px auto 0;
		padding: 110px 20px 0;
	}
}
@media screen and (max-width: 840px) {
	.cont2 {
	    height: auto;
	    background: none;
	    margin: 0 auto 50px;
	}
	.cont2 h2 {
		padding: 0 0 4px;
	    margin: 0 auto 46px;
   	}
	.cont3 {
	    margin: 0 auto 20px;
	}
	.cont3 ul {
	    padding: 0;
	}
	.cont3 ul li {
	    width: 100%;
	    float: none;
	    margin: 0 auto 60px;
	}
	.cont3 ul li:nth-child(1), .cont3 ul li:nth-child(2) {
		padding: 0;
	}
	.cont3 ul li img.sp {
		display: block;
		width: 100%;
		height: auto;
		margin: 0 auto 40px;
	}
	.cont4 {
		margin-bottom: 20px;
	}
}

@media screen and (max-width: 680px) {
	.cont3 ul li p {
	    padding: 0 20px;
	}
	.cont3 ul li p span {
	    font-size: 1.8rem;
	}
	.cont4, .cont5 {
		margin: 0 auto 70px;
	}
	.cont4 .pc, .cont5 .pc {
		display:none;
	}
	.cont4 .sp, .cont5 .sp {
		display:block;
	}
	.cont4 img.sp, .cont5 img.sp {
		float: none;
		width: 100%;
		margin: 0 auto 40px
	}
	.cont4 .txtWrap, .cont5 .txtWrap {
		float: none;
		margin: 0 auto;
		padding: 0;
	}
	.cont3 ul li h3 {
		font-size: 2.2rem;
	    margin: 0 auto 25px;
	    padding: 0 20px 20px;
	}
	.cont4 .txtWrap h3, .cont5 .txtWrap h3 {
		font-size: 2.2rem;
		max-width: none;
		margin: 0 auto 25px;
		border-bottom: solid 1px #000;
    	padding: 0 20px 20px;
	}
	.cont4 .txtWrap p, .cont5 .txtWrap p {
		max-width: none;
		padding: 0 20px;
	}
	.cont4 .txtWrap span, .cont5 .txtWrap span {
		font-size: 1.8rem;
	}
	.cont5 ul {
		float: none;
		display: flex;
		flex-flow: wrap;
		margin-bottom: 40px;
		width: 100%;
	}
	.cont5 ul li {
		width: 50%;
	}
	.cont6 {
	    margin: 80px auto 0;
	}
}

@media screen and (max-width: 640px) {
	.pc {
		display:none;
	}
	.sp {
		display:block;
	}

	.center {
		text-align: left;
	}
	article h2 {
	    font-size: 2.4rem;
	    margin: 0 auto 40px;
	}
	.cont2 h2 {
	    margin: 0 auto 36px;
   	}

	section .lead {
	    margin: 0 auto;
	}

	.cont1 {
	    width: 100%;
	    height:auto;
    	padding: 80px 0 70px;
    }

	.cont6 {
		margin: 80px auto 0;
		padding: 0 20px;
	}
	.cont6 img {
	    width: 200px;
	    top: 40px;
	}
	.footerLink li {
	    width: 50%;
	}
}
@media screen and (max-width: 550px) {
	section h1 {
	    margin: 140px auto 65px;
	}
}

@media screen and (max-width: 414px) {

}
