@charset "UTF-8";
/* CSS Document */

/*■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■
first view
■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■*/
.fv {
	min-height: 500px;
}
.fv-conts {
	display: flex;
	justify-content: center;
	align-items: center;
}
.fv-conts > * {
	padding: 20px;
	width: 50%;
}
.fv-text h1 {
	color: #fff;
	font-size: 3rem;
	font-weight: bold;
	text-align: center;
	margin-bottom: 20px;
}
.fv-text p {
	color: #fff;
	font-size: 1.6rem;
	line-height: 1.5;
	margin-bottom: 20px;
}
.fv-btn {
	color: #fff;
	font-weight: bold;
	font-size: 1.6rem;
	text-align: center;
	display: block;
	margin: auto;
	padding: 20px;
	max-width: 300px;
	width: 80%;
}
.fv-img img {
	width: 100%;
	height: auto;
}
.fv-banner {
  width: 100%;
  padding: 20px;
}
.fv-banner img {
  width: 100%;
  display: block;
}
.fv-banner img.sp-only {
  display: none;
}
/*conts*/
.conts {
	background: url("../../img/bg-txtlogo.svg") 10% center / 7% fixed no-repeat;
}
/*point*/
.point_wrap {
	display: flex;
	justify-content: space-between;
	align-items: center;
}
.point_txt-box {
	order: 1;
	width: calc(60% - 10px);
}
.point-img {
	order: 2;
	width: calc(40% - 10px);
}
.point:nth-of-type(even) .point_txt-box {
	order: 2;
}
.point:nth-of-type(even) .point-img {
	order: 1;
}
.point h2 {
	color: #3700d5;
	font-size: 3rem;
	line-height: 1.5;
	text-align: center;
	margin-bottom: 50px;
}
.point h2 span {
	font-family: abel;
}
.point-txt {
	background: #fff;
	border: 2px solid transparent;
	border-right-color: #7355b0;
	border-left-color: #6975dd;
	margin: 0 auto 30px;
	padding: 40px 30px 30px;
	max-width: 700px;
	width: 80%;
	position: relative;
}
.point-txt::before,
.point-txt::after {
	content: "";
	background: linear-gradient(90deg, #6975dd 0%, #7355b0 100%);
	display: block;
	width: calc(100% + 4px);
	height: 2px;
	box-sizing: border-box;
	position: absolute;
	left: -2px;
}
.point-txt::before {
	top: -2px;
}
.point-txt::after {
	bottom: -2px;
}
.point-txt h3 {
	text-align: center;
	position: absolute;
	top: -15px;
	left: 0;
	right: 0;
	margin: auto;
}
.point-txt h3 span {
	background: #fff;
	font-size: 2rem;
	font-weight: bold;
	padding: 20px;
}
.point-txt p {
	font-size: 1.6rem;
	line-height: 1.5;
}
.point-txt p + p {
	margin-top: 1em;
}
/*.point-img {
	display: flex;
	justify-content: space-between;
}
.point-img li {
	width: calc(100% / 4 - 20px);
}*/
.point-img li img {
	width: 100%;
	height: auto;
}
/*summary*/
.summary h2 {
	color: #3700d5;
	font-size: 3rem;
	font-weight: bold;
	line-height: 1.5;
	text-align: center;
	margin-bottom: 30px;
}
.summary p {
	font-size: 2rem;
	line-height: 1.5;
	text-align: center;
	margin-bottom: 30px;
}
/*catch*/
.service-ad .catch {
	background: url("../../img/service/bg-ad.jpg") no-repeat center center / cover;
}
.service-marketing .catch {
	background: url("../../img/service/bg-marketing.jpg") no-repeat center center / cover;
}
.service-website .catch {
	background: url("../../img/service/bg-website.jpg") no-repeat center center / cover;
}
.catch-cont {
	padding-left: 50%;
}
.catch-cont h2 {
	color: #fff;
	font-size: 3rem;
	font-weight: bold;
	line-height: 1.5;
	text-align: center;
	margin-bottom: 30px;
}
.catch-cont p {
	color: #fff;
	font-size: 1.6rem;
	line-height: 1.5;
	margin-bottom: 30px;
}
.catch-list {
	display: flex;
	justify-content: space-between;
}
.catch-list li {
	border-radius: 5px;
	width: calc(100%/3 - 20px);
	background: #fff;
	padding: 15px;
	display: flex;
	justify-content: center;
	align-items: center;
}
.catch-list li img {
	width: 100%;
	height: auto;
}
/*data*/
.data {
	margin-bottom: 40px;
}
.data h2 {
	color: #3700d5;
	font-size: 2rem;
	font-weight: bold;
	line-height: 1.5;
	text-align: center;
	margin-bottom: 20px;
}
.data p {
	font-size: 1.6rem;
	line-height: 1.5;
	max-width: 800px;
	margin: auto;
}
/*voice*/
.voice h2 {
	color: #3700d5;
	font-size: 3rem;
	font-weight: bold;
	line-height: 1.5;
	text-align: center;
	margin-bottom: 30px;
}
.voice-box {
	background: linear-gradient(90deg, #3fbbfe 0%, #a541ff 100%);
	border-radius: 8px;
	padding: 3px;
	max-width: 800px;
	margin: auto;
}
.voice-box-inner {
	border-radius: 5px;
	background: #fff;
	display: flex;
	justify-content: space-between;
	padding: 20px;
}
.voice-prof {
	width: 150px;
}
.voice-prof img {
	width: 100%;
	height: auto;
}
.voice-prof figure {
	margin-bottom: 20px;
}
.voice-prof figcaption p {
	margin-top: 20px;
}
.voice-prof p {
	font-size: 1.4rem;
	line-height: 1.5;
}
.voice-txt {
	width: calc(100% - 180px);
}
.voice-txt h3 {
	font-size: 2rem;
	font-weight: bold;
	margin-bottom: 20px;
	line-height: 1.5;
}
.voice-txt p {
	font-size: 1.6rem;
	line-height: 1.5;
}
/*exception*/
/*ad*/
.ad_point1 {
	max-width: 600px;
	margin: auto;
}
.ad_point1 > ul {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}
.pdca-list {
	font-size: 1.6rem;
	font-weight: bold;
	line-height: 1.5;
	background: #E0EEEF;
	width: calc(50% - 10px);
	margin-bottom: 20px;
	border-radius: 50%;
	position: relative;
	padding: 20px;
}
.pdca-list::before {
	content: "";
	display: block;
	padding-top: 100%;
}
.pdca-p {
	order: 1;
}
.pdca-d {
	order: 2;
}
.pdca-c {
	order: 4;
}
.pdca-a {
	order: 3;
}
.pdca-inner {
	display: flex;
	justify-content: center;
	align-items: center;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}
.pdca-inner h4 {
	font-size: 16rem;
	color: #fff;
	position: absolute;
	height: 1em;
	line-height: 1;
	text-align: center;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	margin: auto;
	z-index: 1;
}
.pdca-inner ul {
	position: relative;
	max-width: 70%;
	z-index: 3;
}
.pdca-inner li {
	position: relative;
}
.pdca-inner li::before {
	display: block;
	content: '';
	position: absolute;
	top: .5em;
	left: -1em;
	width: 8px;
	height: 3px;
	border-left: 2px solid #83C0C4;
	border-bottom: 2px solid #83C0C4;
	-webkit-transform: rotate(-45deg);
	transform: rotate(-45deg);
}
.pdca-inner i {
	color: #83C0C4;
	font-size: 6rem;
	width: 1em;
	height: 1em;
	line-height: 1;
	text-align: center;
	position: absolute;
	margin: auto;
	z-index: 3;
}
.pdca-p i {
	right: -0.75em;
	top: 0;
	bottom: 0;
}
.pdca-d i {
	bottom: -0.75em;
	left: 0;
	right:  0;
}
.pdca-c i {
	left: -0.75em;
	top: 0;
	bottom: 0;
}
.pdca-a i {
	top: -0.75em;
	left: 0;
	right:  0;
}
/*marketing*/
.marketing_point1 h4 {
	font-size: 2rem;
	font-weight: bold;
	text-align: center;
	color: #049DAB;
	margin: 30px auto;
}
.regions {
	background: #E0EEEF;
	display: flex;
	overflow: hidden;
}
.region {
	flex-basis: 24%;
	position: relative;
	padding: 20px;
}
.region:last-child {
	flex-basis: 28%;
}
.region::before,
.region::after {
	display: block;
	content: '';
	position: absolute;
	background: #fff;
	width: 2px;
	height: calc(50% + 4px);
	right: -15px;
}
.region::before {
	top: -4px;
	transform: rotate(-15deg);
	transform-origin: bottom right;
}
.region::after {
	bottom: -4px;
	transform: rotate(15deg);
	transform-origin: top left;
}
.region:last-child::before,
.region:last-child::after {
	display: none;
}
.region h5 {
	font-size: 1.6rem;
	font-weight: bold;
	text-align: center;
	margin-bottom: 10px;
}
.region h6 {
	color: #5C9DA1;
	font-size: 1.6rem;
	text-align: center;
	margin-bottom: 10px;
}
.region li {
	font-size: 1.6rem;
	line-height: 1.5;
	padding-left: 1em;
	position: relative;
}
.region li::before {
	display: block;
	content: '';
	position: absolute;
	top: .5em;
	left: .25em;
	width: 8px;
	height: 3px;
	border-left: 2px solid #83C0C4;
	border-bottom: 2px solid #83C0C4;
	-webkit-transform: rotate(-45deg);
	transform: rotate(-45deg);
}
.marketing_point1_summary {
	background: #fff;
	border: 5px double #3700d5;
	margin: 30px auto 0;
	padding: 20px;
	font-size: 2rem;
	line-height: 1.5;
	max-width: 700px;
}
.marketing_point3 h4 {
	font-size: 2rem;
	font-weight: bold;
	line-height: 1.5;
	text-align: center;
	margin: 30px auto 50px;
}
.map_wrap {
	display: flex;
	justify-content: space-between;
	align-items: center;
}
.map_wrap > * {
	width: calc(50% - 15px);
}
.map_cats div {
	position: relative;
}
.map_cats div + div {
	margin-top: 30px;
}
.map_cats dt {
	font-weight: bold;
	border-radius: 3px;
	color: #fff;
	text-align: center;
	font-size: 1.6rem;
	width: 10em;
	height: 24px;
	line-height: 24px;
	position: absolute;
	left: .5em;
	top: -12px;
	z-index: 2;
}
.map_cats dd {
	background: #fff;
	border-width: 2px;
	border-style: solid;
	border-radius: 5px;
	padding: 20px 15px;
	position: relative;
	z-index: 1;
}
.map_cats dd span {
	border-radius: 50%;
	color: #fff;
	font-weight: bold;
	text-align: center;
	font-size: 2rem;
	line-height: 3em;
	width: 3em;
	height: 3em;
	position: absolute;
	left: 10px;
	top: 0;
	bottom: 0;
	margin: auto;
}
.map_cats dd p {
	font-size: 1.6rem;
	line-height: 1.5;
	padding-left: 70px;
}
.map_cat-a dt,
.map_cat-a dd span {
	background: #A4393A;
}
.map_cat-a dd {
	border-color: #A4393A;
}
.map_cat-b dt,
.map_cat-b dd span {
	background: #4039A4;
}
.map_cat-b dd {
	border-color: #4039A4;
}
.map_cat-c dt,
.map_cat-c dd span {
	background: #288C88;
}
.map_cat-c dd {
	border-color: #288C88;
}
.map_cat-d dt,
.map_cat-d dd span {
	background: #298C47;
}
.map_cat-d dd {
	border-color: #298C47;
}
.map_cat-e dt,
.map_cat-e dd span {
	background: #A46E39;
}
.map_cat-e dd {
	border-color: #A46E39;
}
/*ad*/
.service-ad .fv-inner {
	max-width: 1000px;
	margin: 0 auto;
	padding: 40px 20px 6vw;
	height: 500px;
	display: flex;
}
.fv-inner > * {
	padding: 20px;
	width: 50%;
}
.service-ad .fv-img {
	padding: 0;
	position: relative;
	z-index: 1;
}
.service-ad .fv-img img {
	width: 100%;
	height: auto;
	position: relative;
	z-index: 2;
}

.service-ad .fv-text {
	padding-left: 40px;
}

.service-ad h1 {
	font-size: 2rem;
	line-height: 1.5;
	font-weight: bold;
}
.service-ad h1 em {
	font-size: 1.5em;
	line-height: 1.75;
	position: relative;
}
.service-ad h1 em::before {
	content: "";
	display: block;
	background: #fff;
	height: 2px;
	width: 0;
	position: absolute;
	left: -5%;
	bottom: -5px;
	transition: .5s;
	transition-delay: 1s;
}
.service-ad h1 em.inview::before {
	width: 110%;
}
.service-ad .fv-text p {
	position: static;
	margin-top: 20px;
}
.service-ad .ask h3 {
	font-size: 2rem;
	margin-top: 70px;
	font-weight: bold;
	line-height: 1.75;
}
.cause {
	overflow: hidden;
	position: relative;
	margin: 60px 0 50px;
}
.cause::before {
	content: '';
	display: block;
	width: 100%;
	height: 30px;
	position: absolute;
	top: 0;
	left: 0;
 background-image: linear-gradient(to bottom left, rgba(255,255,255,1), rgba(255,255,255,1) 50%, rgba(255,255,255,0) 50%, rgba(255,255,255,0));
}
.cause::after {
	content: '';
	display: block;
	width: 100%;
	height: 30px;
	position: absolute;
	bottom: 0;
	left: 0;
background-image: linear-gradient(to top right, rgba(255,255,255,1), rgba(255,255,255,1) 50%, rgba(255,255,255,0) 50%, rgba(255,255,255,0));
}
.grain::before {
	content: "";
	display: block;
	width: 110%;
	height: 110%;
	position: absolute;
	top: -5%;
	left: -5%;
	background: url("../../img/service/ad/bg-noise.jpg");
	animation: grain 0.5s steps(1) infinite;
	z-index: -1;
}
@keyframes grain {
  0%, 100% {
    transform: translate(0, 0, 0);
  }

  10% {
    transform: translate(-1%, -1%);
  }

  20% {
    transform: translate(1%, 1%);
  }

  30% {
    transform: translate(-2%, -2%);
  }

  40% {
    transform: translate(3%, 3%);
  }

  50% {
    transform: translate(-3%, -3%);
  }

  60% {
    transform: translate(4%, 4%);
  }

  70% {
    transform: translate(-4%, -4%);
  }

  80% {
    transform: translate(2%, 2%);
  }

  90% {
    transform: translate(-3%, -3%);
  }
}
.cause-inner {
	display: flex;
	justify-content: space-between;
	align-items: center;
}
.cause-inner > * {
	width: 50%;
}
.cause-inner figure {
	padding: 30px;
}
.cause-inner figure img {
	width: 100%;
	height: auto;
}
.cause-inner h2 {
	font-size: 3rem;
	line-height: 1.75;
}
.c-pyramid-list {
	background: url("../../img/service/ad/c-pyramid.svg") no-repeat left center / contain;
	display: flex;
	flex-direction: column;
	height: 275px;
}
.logic h2{
	font-size: 3rem;
	font-weight: bold;
	line-height: 1.5;
    margin: 20px auto 80px;
    text-align: center;
	position: relative;
}
.logic h2 span {
    display: inline-block;
    color: #fff;
    padding: 5px 15px;
    position: relative;
    z-index: 1;
}
.logic h2 span::before {
content: "";
    display: block;
    width: 0;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    z-index: -1;
    background: -webkit-linear-gradient(left, rgb(18,214,223) 0%, rgb(247,15,255) 100%);
    background: -o-linear-gradient(left, rgb(18,214,223) 0%, rgb(247,15,255) 100%);
    background: linear-gradient(to right, rgb(18,214,223) 0%, rgb(247,15,255) 100%);
    transition: .5s;
}
.logic h2 span.inview::before {
	width: 100%;
}
.logic h3{
	font-size: 2rem;
	text-align: center;
	margin: 30px auto;
	line-height: 1.5;
}
.img_c-pyramid {
	margin-bottom: 60px;
}
.c-pyramid-list {
	background: url("../../img/service/ad/c-pyramid.svg") no-repeat left center / contain;
	display: flex;
	flex-direction: column;
	height: 275px;
	max-width: 800px;
	margin: auto;
}
.pyramid {
	display: flex;
}
.pyramid dt {
	display: flex;
	justify-content: center;
	align-items: center;
	text-align: center;
	font-size: 1.6rem;
	color: #fff;
	width: 310px;
}
.pyramid dd {
	font-size: 1.6rem;
	line-height: 1.5;
}
.pyramid dd ul {
	list-style-type: square;
	line-height: 1.5;
	margin-left: 20px;
}
.pyramid dd:nth-of-type(1) {
	width: calc((100% - 350px)/2);
}
.c-pyramid-list .pyramid p {
	font-weight: bold;
	padding: 5px 10px;
	margin: auto;
}
.pyramid:first-child dt {
	height: 80px;
}
.pyramid:first-child dt p {
	background: rgba(165,25,255,0.50);
}
.pyramid:nth-child(2) dt {
	height: 95px;
}
.pyramid:nth-child(3) dt {
	height: 95px;
}
.pyramid:first-child dd {
	color: #a519ff;
}
.pyramid:nth-child(2) dd {
	color: #1c4eff;
}
.pyramid:nth-child(3) dd {
	color: #0fe280;
}
.c-pyramid-spList {
	display: none;
}
.pyramid-desc{
	background: #fff;
	font-size: 1.6rem;
    width: 70%;
    line-height: 1.5;
    margin: 0 auto 100px;
    border: solid 1px #000;
    padding: 20px;
}
.img_df-ttl {
	display: flex;
	justify-content: space-between;
	align-items: center;
}
.img_dual-funnel .img_df-ttl h4 {
	font-size: 2rem;
	line-height: 1.25;
	font-weight: bold;
	padding: 10px;
	width: calc(100%/7*3 - 5px);
	position: relative;
}
.img_dual-funnel .img_df-ttl h4:first-child {
	color: #E88181;
	border-bottom: 1px solid #E88181;
}
.img_dual-funnel .img_df-ttl h4:last-child {
	color: #81B2E8;
	border-bottom: 1px solid #81B2E8;
}
.img_dual-funnel .img_df-ttl h4:first-child::before,
.img_dual-funnel .img_df-ttl h4:last-child::before {
	content: "";
	display: block;
	width: 20px;
	height: 1px;
	position: absolute;
	bottom: 0;
	right: 0;
	transform: rotate(45deg);
	transform-origin: right bottom;
}
.img_dual-funnel .img_df-ttl h4:first-child::before {
	background: #E88181;
}
.img_dual-funnel .img_df-ttl h4:last-child::before {
	background: #81B2E8;
}
.img_df-list {
	display: flex;
	justify-content: space-between;
	align-items: center;
}
.img_df-list li {
	width: calc(100%/7 - 5px);
	position: relative;
	overflow: hidden;
}
.img_df-list li::before,
.img_df-list li::after {
	display: block;
	content: "";
	background: #fff;
	width: 120%;
	height: 40px;
	position: absolute;
	left: -10%;
	right: auto;
}
.img_df-list .img_df-nc-part::before {
	top: -20px;
	transform: rotate(10deg);
}
.img_df-list .img_df-nc-part::after {
	bottom: -20px;
	transform: rotate(-10deg);
}
.img_df-list .img_df-ec-part::before {
	top: -20px;
	transform: rotate(-10deg);
}
.img_df-list .img_df-ec-part::after {
	bottom: -20px;
	transform: rotate(10deg);
}
.img_dual-funnel .img_df-list li h5 {
	font-size: 1.6rem;
	font-weight: bold;
	line-height: 1.5;
	padding: 5px;
	color: #fff;
	text-align: center;
	margin: auto;
}
.img_df-list li:nth-child(1) {
	background: #E88181;
	padding: 90px 0;
}
.img_df-list li:nth-child(2) {
	background: #E8A381;
	padding: 65px 0;
}
.img_df-list li:nth-child(3) {
	background: #E8D581;
	padding: 40px 0;
}
.img_df-list li:nth-child(4) {
	background: #aaa;
	padding: 5px 0;
}
.img_df-list li:nth-child(4)::before,
.img_df-list li:nth-child(4)::after {
	display: none;
}
.img_df-list li:nth-child(5) {
	background: #81B2E8;
	padding: 40px 0;
}
.img_df-list li:nth-child(6) {
	background: #B181E8;
	padding: 53px 0;
}
.img_df-list li:nth-child(7) {
	background: #E881C7;
	padding: 90px 0;
}

.ad-strategy h2 {
	font-size: 5rem;
	font-weight: bold;
	font-family: "游明朝", YuMincho, "Hiragino Mincho ProN W3", "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
	line-height: 1.5;
    margin-bottom: 50px;
	transform: rotate(-15deg);
	position: relative;
}
.adst-line{
	display: inline-block;
	background: linear-gradient(to right, #7776ff 0%, #ae2cf1 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
	position: relative;
}
.adst-line::before {
	content: "";
	display: block;
	background-image: -webkit-linear-gradient( 0deg, rgb(2,161,249) 0%, rgb(41,241,156) 100%);
	height: 2px;
	width: 0;
	position: absolute;
	bottom: 0;
	left: 0;
	transition: .5s;
	transition-delay: 1s;
}
.adst-line.inview::before {
	width: 110%;
}
.adst-inner {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}
.adst-inner > div {
	width: calc(50% - 15px);
}
.adst-inner .swiper-container {
	height: 400px;
}
.swiper-slide {
	display: flex;
}
.cycle {
	border-top: 1px solid #ddd;
	border-bottom: 1px solid #ddd;
}
.adst-inner .cycle_inner {
	display: flex;
	line-height: 1.5;
	background: #fff;
	width: 100%;
	border: 1px solid #ddd;
	border-top: none;
}
.adst-inner .swiper-slide-active div {
	font-weight: bold;
}
.cycle_inner dt,
.cycle_inner dd {
	padding: 15px;
	transition: .2s;
}
.cycle_inner dt {
	background: #94AEBC;
	color: #fff;
	font-size: 3rem;
	width: 7.5em;
}
.swiper-slide-active dt {
	background: #3700d5;
}
.swiper-slide-prev dt,
.swiper-slide-next dt {
	background: #4D76AB
}
.cycle_inner dd {
	width: calc(100% - 7.5em);
	font-size: 1.6rem;
}
.cycle_pdca {
	position: relative;
	bottom: -40px;
}
.cycle_ooda {
	position: relative;
	top: -40px;
}
.ad-st_exp {
	margin-top: 60px;
	padding: 30px;
}
.ad-st_exp p {
	font-size: 1.6rem;
	line-height: 1.5;
}
.ad-st_exp p + p {
	margin-top: 1em;
}
.ad-summary li h2{
	width: 80%;
	max-width: 500px;
    font-size: 1.6rem;
    line-height: 1.5;
	padding: 50px;
	color:#fff;
	margin:auto;
	font-weight:bold;
}
.ad-summary_txtBox {
	display: flex;
	justify-content: center;
	align-items: center;
}
.ad-summary_txtBox li:first-child {
	width: 60%;
}
.ad-summary_txtBox li:last-child {
	width: 30%;
}
.ad-summary_txtBox li img {
	width: 100%;
	height: auto;
}
.ad-summary_shapeBg {
	background: url("../../img/service/ad/ad-summaryText01.svg") no-repeat center center / contain;
	padding: 40px;
	position: relative;
	z-index: 1;
}
.ad-summary_shapeBg::before {
	content: "";
	display: block;
	background: url("../../img/service/ad/ad-summaryText02.svg") no-repeat center center / contain;
	height: 95%;
	width: 95%;
	position: absolute;
	left: 0;
	right: 0;
	top: 0;
	bottom: 0;
	margin: auto;
	z-index: 2;
}
.ad-summary_txtTtl li:last-child {
	position: relative;
	left: -15%;
	z-index: 2;
}
.ad-summary_txtBox + .ad-summary_txtBox {
	margin-top: 40px;
}
.ad-summary_txtDetail {
	flex-direction: row-reverse;
}
.ad-summary_txtDetail li:first-child {
	padding: 50px;
}
.ad-summary-text{
	font-size: 1.6em;
	padding: 30px;
	line-height: 1.5;
	background: #eeeeee;
}

.ad-analytics {
	position: relative;
	margin: 50px 0;
	padding: 50px 0;
}
.ad-analytics::before {
	content: '';
	display: block;
	width: 100%;
	height: 30px;
	position: absolute;
	top: 0;
	left: 0;
 background-image: linear-gradient(to bottom left, rgba(255,255,255,1), rgba(255,255,255,1) 50%, rgba(255,255,255,0) 50%, rgba(255,255,255,0));
}
.ad-analytics::after {
	content: '';
	display: block;
	width: 100%;
	height: 30px;
	position: absolute;
	bottom: 0;
	left: 0;
background-image: linear-gradient(to top right, rgba(255,255,255,1), rgba(255,255,255,1) 50%, rgba(255,255,255,0) 50%, rgba(255,255,255,0));
}
.ad-a_inner {
	display: flex;
	justify-content: center;
	align-items: center;
}
.ad-a_inner > div {
	position: relative;
}
.ad-a_inner > div:nth-child(1) {
	z-index: 1;
	right: -15px;
	top: -40px;
}
.ad-a_inner > div:nth-child(2) {
	z-index: 2;
	flex-basis: 50%;
}
.ad-a_inner > div:nth-child(3) {
	z-index: 3;
	left: -15px;
	bottom: -40px;
}
.ad-analytics h2 {
	writing-mode: vertical-rl;
	font-size: 3rem;
	font-weight: bold;
	line-height: 1.5;
	padding: 20px;
	box-shadow: 0px 10px 5px 1px rgba(43, 43, 43, 0.1);
}
.ad-a_base h2 {
	background: #000;
	color: #fff;
}
.ad-a_cycle h2 {
	border: 1px solid #000;
	background: #fff;
	color: #000;
}
.ad-a_txt {
	background: #fff url("../../img/service/ad/bg-logo.svg") no-repeat center center / 120%;;
	padding: 30px 35px;
}
.ad-a_txt p {
	font-size: 1.6rem;
	line-height: 1.5;
}
.ad-a_txt p + p {
	margin-top: 1em;
}
.ad_contact h2 {
	font-size: 2rem;
	font-weight: bold;
	text-align: center;
	line-height: 1.5;
}
#display {
	display: flex;
	color: #fff;
	font-size: 4rem;
	line-height: 1.5;
	word-break: break-all;
	text-align: justify-all;
	align-items: center;
	justify-content: center;
	height: 70%;
	overflow: hidden;
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	margin: auto;
	z-index: 1;
}
#display::before {
background: #262626;
	display: flex;
	width: 100%;
	height: 100%;
	align-items: center;
	justify-content: center;
	color: #fff;
  content: '広告運用';
  overflow: hidden;
  position: absolute;
	clip-path: polygon(0% 5% , 100% 5%, 100% 5%, 0% 5%);
	-webkit-clip-path: polygon(0% 5% , 100% 5%, 100% 5%, 0% 5%);
  top: 0;
  left: 0;
  animation: sliding 1s linear infinite;
}
@keyframes sliding {
	0% {
		clip-path: polygon(0% 5% , 100% 5%, 100% 5%, 0% 5%);
		-webkit-clip-path: polygon(0% 5% , 100% 5%, 100% 5%, 0% 5%);
	}
  50% {
    clip-path: polygon(0% 50%, 100% 50%, 100% 100%, 0% 100%);
    -webkit-clip-path: polygon(0% 50%, 100% 50%, 100% 100%, 0% 100%);
  }
  100% {
    clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
    -webkit-clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
  }
}
/*marketing*/
.marketing_point1 h4 {
	font-size: 2rem;
	font-weight: bold;
	text-align: center;
	color: #049DAB;
	margin: 30px auto;
}
.regions {
	background: #E0EEEF;
	display: flex;
	overflow: hidden;
}
.region {
	flex-basis: 24%;
	position: relative;
	padding: 20px;
}
.region:last-child {
	flex-basis: 28%;
}
.region::before,
.region::after {
	display: block;
	content: '';
	position: absolute;
	background: #fff;
	width: 2px;
	height: calc(50% + 4px);
	right: -15px;
}
.region::before {
	top: -4px;
	transform: rotate(-15deg);
	transform-origin: bottom right;
}
.region::after {
	bottom: -4px;
	transform: rotate(15deg);
	transform-origin: top left;
}
.region:last-child::before,
.region:last-child::after {
	display: none;
}
.region h5 {
	font-size: 1.6rem;
	font-weight: bold;
	text-align: center;
	margin-bottom: 10px;
}
.region h6 {
	color: #5C9DA1;
	font-size: 1.6rem;
	text-align: center;
	margin-bottom: 10px;
}
.region li {
	font-size: 1.6rem;
	line-height: 1.5;
	padding-left: 1em;
	position: relative;
}
.region li::before {
	display: block;
	content: '';
	position: absolute;
	top: .5em;
	left: .25em;
	width: 8px;
	height: 3px;
	border-left: 2px solid #83C0C4;
	border-bottom: 2px solid #83C0C4;
	-webkit-transform: rotate(-45deg);
	transform: rotate(-45deg);
}
.marketing_point1_summary {
	background: #fff;
	border: 5px double #3700d5;
	margin: 30px auto 0;
	padding: 20px;
	font-size: 2rem;
	line-height: 1.5;
	max-width: 700px;
}
.marketing_point3 h4 {
	font-size: 2rem;
	font-weight: bold;
	line-height: 1.5;
	text-align: center;
	margin: 30px auto 50px;
}

/*---------------
-----WEBSITE-----
---------------*/
.service-website .fv-text p {
	font-size: 1.8rem;
	line-height: 1.7;
	margin-bottom: 30px;
}
.code-editor {
	background: #333;
	border-radius: 0 0 5px 5px;
	padding: 40px 20px 20px;
	margin-top: 30px;
	position: relative;
}
.code-editor:before {
	content: "";
	display: block;
	position: absolute;
	width: 100%;
	top: 0;
	left: 0;
	height: 20px;
	background-color: #fafafa;
	border-radius: 5px 5px 0 0;
}
.code-editor span.control:before {
	content: '';
	display: block;
	position: absolute;
	top: 5px;
	left: 10px;
	z-index: 2;
	width: 10px;
	height: 10px;
	border-radius: 50%;
}
.code-editor span.control:nth-child(1):before {
	background-color: #df6963;

}
.code-editor span.control:nth-child(2):before {
	margin-left: 15px;
	background-color: #f5e18a;

}
.code-editor span.control:nth-child(3):before {
	margin-left: 30px;
	background-color: #97c38a;
}
.code {
	font-family: Consolas, Monaco, 'Andale Mono', monospace;
	color: #fff;
	border-right: 1px solid #fff;
	white-space: nowrap;
	word-break: break-all;
	overflow: hidden;
	font-size: 1.4rem;
	line-height: 1;
}
.code + .code {
	margin-top: 10px;
}
.code:nth-of-type(1) {
	width: 15ch;
	-webkit-animation: typing 7s steps(15, end),
	blink-caret .5s step-end infinite alternate;
}
.code:nth-of-type(2) {
	width: 44ch;
	-webkit-animation: typing 7s steps(44, end),
	blink-caret .5s step-end infinite alternate;
}
.code:nth-of-type(3) {
	width: 24ch;
	-webkit-animation: typing 7s steps(24, end),
	blink-caret .5s step-end infinite alternate;
}
.code:nth-of-type(4) {
	width: 22ch;
	-webkit-animation: typing 7s steps(22, end),
	blink-caret .5s step-end infinite alternate;
}
@-webkit-keyframes typing { from { width: 0; } }
@-webkit-keyframes blink-caret { 50% { border-color: transparent; } }
.service-website .cv-btn,
.service-ad .cv-btn {
	display: block;
	font-size: 2.4rem;
	font-weight: bold;
	color: #fff;
	background: #F48500;
	text-align: center;
	margin-left: auto;
	margin-right: auto;
	max-width: 400px;
	width: 100%;
	height: 70px;
	line-height: 70px;
	border-radius: 35px;
	transition: .3s;
}
.service-website .cv-btn:hover,
.service-ad .cv-btn:hover {
	opacity: .7;
}
.divider {
	overflow: hidden;
}
.divider img{
	width: 110vw;
	height: auto;
	transform: rotate(180deg);
	position: relative;
	left: -5vw;
	bottom: -2px;
}
/*ask*/
.ask {
	text-align: center;
}
.ask h2 {
	display: inline-block;
	font-size: 4rem;
	font-weight: bold;
	text-align: center;
	color: #fff;
background: linear-gradient(to right, #7776ff 0%, #ae2cf1 100%);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	margin-bottom: 50px;
}
.trouble {
	background: #333;
	border-radius: 15px;
	color: #fff;
	font-size: 2.4rem;
	font-weight: bold;
	line-height: 2;
	max-width: 850px;
	margin: 0 auto;
	padding: 30px;
	width: 80%;
	position: relative;
}
.trouble::before,
.trouble::after {
	color: #fff;
	font-size: 8rem;
	position: absolute;
	line-height: 1;
}
.trouble::before {
	content: "“";
	top: 5px;
	left: 10px;
}
.trouble::after {
	content: "”";
	bottom: -30px;
	right: 10px;
}
/*exp*/
.exp {
	background: #edf3f6;
	position: relative;
	margin: 100px 0 50px;
}
.exp::before {
	content: '';
	display: block;
width: 100%;
height: 30px;
	position: absolute;
	top: -30px;
	left: 0;
background-image: linear-gradient(to top right, #edf3f6, #edf3f6 50%, rgba(255,255,255,0) 50%, rgba(255,255,255,0));
}
.exp::after {
	content: '';
	display: block;
width: 100%;
height: 30px;
	position: absolute;
	bottom: -30px;
	left: 0;
background-image: linear-gradient(to bottom left, #edf3f6, #edf3f6 50%, rgba(255,255,255,0) 50%, rgba(255,255,255,0));
}
.exp_box {
	display: flex;
	justify-content: space-between
}
.exp_box > * {
	width: calc(50% - 10px);
}
.exp_txt h2 {
	text-align: center;
	font-weight: bold;
	font-size: 2.4rem;
	margin-bottom: 20px;
}
.exp_txt p {
	font-size: 1.8rem;
	line-height: 1.5;
}
.exp_img {
	position: relative;
	z-index: 1;
}
.exp_img img{
	width: 80%;
	height: auto;
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
	margin: auto;
	z-index: 1;
}
.exp_img p {
	background: #00a0e2;
	color: #fff;
	font-size: 1.6rem;
	font-weight: bold;
	text-align: center;
	line-height: 1.2;
	padding: 15px;
	border-radius: 50%;
	position: absolute;
	z-index: 2;
}
.exp_img p:nth-of-type(1) {
	left: 15%;
	top: 30%;
}
.exp_img p:nth-of-type(2) {
	right: 40%;
	top: 20%;
}
/*pm*/
.pm {
	position: relative;
}
.pm h2 {
	display: flex;
	align-items: center;
	width: 40%;
	min-width: 300px;
	height: 100px;
	position: absolute;
	right: 0;
	top: 10vw;
	z-index: 2;
}
.pm h2 em {
	 display: block;
    color: #fff;
    font-size: 3rem;
    font-weight: bold;
    line-height: 1.2;
    padding: 20px;
    width: 100%;
    position: relative;
    z-index: 2;
}
.pm h2::after {
	content: "";
	display: block;
	background: url("../../img/service/website/pm_ttl-bg1.svg") no-repeat left top / contain, url("../../img/service/website/pm_ttl-bg2.svg") no-repeat right 30% bottom / contain;
	width: 120%;
	height: 200%;
	position: absolute;
	left: -20%;
	top: -40%;
	z-index: -1;
}
.pm-img-list {
	width: 60vw;
	display: flex;
	flex-wrap: wrap;
	padding-left: 10vw;
}
.pm-img-list li {
	width: 50%;
	height: auto;
	position: relative;
	z-index: 1;
}
.pm-img-list li img {
	width: 70%;
	height: auto;
	margin: 20px auto;
}
.pm-img-list li:nth-child(2) {
	top: 10vw;
	left: -5vw;
}
.pm-img-list li:nth-child(3) {
	margin-top: 2vw;
	left: 5vw;
}
.pm-img-list li::before {
	content: "";
	display: block;
	width: 120%;
	height: 120%;
	position: absolute;
	left: -10%;
	top: -10%;
	z-index: -1;
}
.pm-img-list li:nth-child(1)::before {
	background: url("../../img/service/website/pm_bg1.svg") no-repeat center center / contain;
}
.pm-img-list li:nth-child(2)::before {
	background: url("../../img/service/website/pm_bg2.svg") no-repeat center center / contain;
}
.pm-img-list li:nth-child(3)::before {
	background: url("../../img/service/website/pm_bg3.svg") no-repeat center center / contain;
}
.pm-img-list h3 {
	font-size: 2.4rem;
	font-weight: bold;
	line-height: 1.5;
	color: #4812d4;
	text-align: center;
}
.pm_txt {
	background-image: linear-gradient(to left, rgba(235,105,240,1.00) 0%, rgba(88,217,223,1.00) 100%);
	box-shadow: 15px 15px rgba(0,0,0,.1);
	width: 40%;
	padding: 30px;
	position: absolute;
	right: 3vw;
	bottom: 2vw;
	z-index: 3;
}
.pm_txt p {
	color: #fff;
	font-size: 1.6rem;
	font-weight: bold;
	line-height: 1.5;
}
.seo {
	margin-top: 60px;
}
.seo h2 {
	font-size: 3rem;
	font-weight: bold;
	line-height: 1.5;
	padding: 30px;
	text-align: center;
	position: relative;
	margin: auto;
}
.seo h2::before,
.seo h2::after {
	content: "";
	display: block;
	width: calc(50% - 7em);
	height: 100%;
	position: absolute;
	top: 0;
	bottom: 0;
}
.seo h2::before {
	background: url("../../img/service/website/seo_ttlL.svg") no-repeat center center / contain;
	right: calc(50% + 6em);
}

.seo h2::after {
	background: url("../../img/service/website/seo_ttlR.svg") no-repeat center center / contain;
	left: calc(50% + 6em);
}
.seo h2 em,
.strength h2 em {
	display: inline-block;
	color: #fff;
	padding: 5px 10px;
	position: relative;
	z-index: 1;
}
.pm h2 em::before,
.seo h2 em::before,
.strength h2 em::before {
	content: "";
	display: block;
	width: 0;
	height: 100%;
	position: absolute;
	left: 0;
	top: 0;
	z-index: -1;
background: -webkit-linear-gradient(left, rgb(18,214,223) 0%, rgb(247,15,255) 100%);
background: -o-linear-gradient(left, rgb(18,214,223) 0%, rgb(247,15,255) 100%);
background: linear-gradient(to right, rgb(18,214,223) 0%, rgb(247,15,255) 100%);
	transition: .5s;
}
.pm h2 em.inview::before,
.seo h2 em.inview::before,
.strength h2 em.inview::before {
	width: 100%;
}
.seo h3 {
	display: inline-block;
	font-size: 3rem;
	font-weight: bold;
	line-height: 1.5;
	text-align: center;
	color: #fff;
background: -webkit-linear-gradient(left, #7776ff 0%, #ae2cf1 100%);
background: -o-linear-gradient(left, #7776ff 0%, #ae2cf1 100%);
background: linear-gradient(to right, #7776ff 0%, #ae2cf1 100%);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	margin: 60px auto 80px;
}
.seo_detail + .seo_detail {
	margin-top: 40px;
}
.seo_detail h4 {
	color: #fff;
	font-weight: bold;
	font-size: 2rem;
	line-height: 1.5;
	text-align: center;
	padding: 30px;
	max-width: 500px;
}
.seo_detail p {
	box-shadow: 0px 3px 7px 0px rgba(0, 0, 0, 0.1);
	font-size: 1.6rem;
	line-height: 1.5;
	padding: 30px;
	background: #fff;
}
.seo_detail ol {
	counter-reset: item;
	display: flex;
	justify-content: space-between;
}
.seo_detail li {
	position: relative;
	padding: 30px 0 0 30px;
}
.seo_detail li::before {
	counter-increment: item;
	content: counter(item);
	display: block;
	font-size: 3rem;
	font-weight: bold;
	color: #fff;
	line-height: 1.5;
	width: 1.5em;
	height: 1.5em;
	border-radius: 50%;
	text-align: center;
	position: absolute;
	left: 0;
	top: 0;
}
.seo_detail li h5 {
	font-size: 1.6rem;
	font-weight: bold;
	line-height: 1.5;
	text-align: center;
	position: relative;
}
.seo_detail li h5::before,
.seo_detail li h5::after {
	content: "";
	display: block;
	border-radius: 50%;
	position: absolute;
}
.seo_detail li h5::before {
	width: 15px;
	height: 15px;
	left: 5px;
	top: 5px;
}
.seo_detail li h5::after {
	width: 7px;
	height: 7px;
	left: 20px;
	top: 20px;
}
.seo-writing li h5::before,
.seo-writing li h5::after {
	background: #13d5df;
}
.seo-site li h5::before,
.seo-site li h5::after {
	background: #f610ff;
}
.seo-writing {
	display: flex;
	justify-content: space-between;
	position: relative;
}
.seo-writing > * {
	width: calc(50% - 20px);
}
.seo-writing_txt h4 {
	background: #13d5df;
	position: absolute;
	top: -30px;
	z-index: 2;
}
.seo-writing_txt p {
	position: relative;
	z-index: 1;
	bottom: -75px;
	left: 20px;
}
.seo-site_txt {
	display: flex;
	position: relative;
	margin-bottom: 60px;
}
.seo-site_txt h4 {
	background: #f610ff;
	width: 60%;
	position: absolute;
	top: -30px;
	z-index: 2;
}
.seo-site_txt p {
	margin-left: auto;
	width: calc(100% - 485px);
	position: relative;
	z-index: 1;
}

.seo-writing_img li {
	width: calc(50% - 10px);
}
.seo-writing_img li::before {
	background: #13d5df;
}
.seo-site_img li {
	width: calc((100%)/3 - 10px);
}
.seo-site_img li::before {
	background: #f610ff;
}
.appeal {
	background: url("../../img/service/website/pat-cross.jpg");
	padding: 40px 0;
	margin: 100px auto 40px;
	position: relative;
	z-index: 1;
}
.appeal::before,
.appeal::after {
	content: "";
	display: block;
	width: 100%;
	height: 50px;
	position: absolute;
	left: 0;
	z-index: 2;
}
.appeal::before {
	background: url("../../img/service/website/bg_dividerTop.svg") repeat-x;
	top: 0;
}
.appeal::after {
	background: url("../../img/service/website/bg_dividerBottom.svg") repeat-x;
	bottom: 0;
}
.appeal .inner800 {
	position: relative;
}
.appeal h2 {
	width: 20%;
	writing-mode: vertical-rl;
	font-size: 4rem;
	font-weight: bold;
	text-align: center;
	line-height: 1.5;
	position: absolute;
	right: 0;
	top: -10vw;
	z-index: 2;
}
.appeal_txtbox {
	width: 80%;
}
.appeal_txtbox img {
	width: 100%;
	height: auto;
}
.appeal_txt {
	border-radius: 255px 15px 225px 15px/15px 225px 15px 255px;
	background: #00b0ff;
	padding: 30px 40px;
}
.appeal_txt p {
	color: #fff;
	font-size: 1.6rem;
	font-weight: bold;
	line-height: 1.5;
}
.appeal_txt p + p {
	margin-top: 1em;
}
.strength {
	position: relative;
}
.strength h2 {
	font-size: 3rem;
	font-weight: bold;
	text-align: center;
	line-height: 1.7;
	margin-bottom: 50px;
}
.strength h2 span {
	font-size: 3.6rem;
	display: inline-block;
background: linear-gradient(to right, rgb(18,214,223) 0%, rgb(247,15,255) 100%);
	color: #fff;
	padding: 5px;
}
.st_flow {
	background: url("../../img/service/website/st_bg.svg") no-repeat center center / 30%;
	position: relative;
	height: 80vh;
	margin-bottom: 40px;
	z-index: 1;
}
.st_flow li {
	width: 25%;
	position: absolute;
}
.st_flow li i {
	display: none;
}
.st_flow h3 {
	font-size: 2rem;
	font-weight: bold;
	text-align: center;
	margin: 0 auto 10px;
}
.st_flow p {
	font-size: 1.6rem;
	line-height: 1.5;
	margin: 10px auto;
	text-align: center;
}
.st_flow figure img {
	width: 75%;
	height: auto;
	margin: auto;
}
.st_flow li:nth-child(1) {
	left: 15%;
	bottom: 0;
}
.st_flow li:nth-child(2) {
	left: 0;
	bottom: 30%;
}
.st_flow li:nth-child(3) {
	left: 12%;
	bottom: 60%;
}
.st_flow li:nth-child(4) {
	right: 35%;
	top: 0;
}
.st_flow li:nth-child(5) {
	right: 10%;
	top: 20%;
}
.st_flow li:nth-child(6) {
	right: 5%;
	top: 55%;
}
.st_flow li:nth-child(7) {
	right: 30%;
	bottom: 0;
}
.st_flow li:nth-child(1) img,
.st_flow li:nth-child(5) img,
.st_flow li:nth-child(6) img {
	width: 60%;
	margin: auto;
}
.mask {
	position: absolute;
	width: 100%;
	height: auto;
	padding-top: 250px;
	top: 0;
	left: 0;
	z-index: -1;
}
.cls-1{
	fill:none;
	stroke:#fff;
	stroke-miterlimit:10;
	stroke-width:63px;
}
.closing h2 {
	background-image: linear-gradient(to right, rgb(119,118,255) 0%, rgb(174,44,241) 100%);
	color: #fff;
	font-size: 2.4rem;
	font-weight: bold;
	width: 66%;
	padding: 15px 15px 15px 10%;
	line-height: 1.5;
	margin-bottom: 20px;
}
.closing p {
	background: #fff;
	box-shadow:  0px 1px 5px 2px rgba(43, 43, 43, 0.1);
	width: 40%;
	padding: 30px;
	font-size: 1.6rem;
	font-weight: bold;
	line-height: 1.7;
	margin: auto 5vw 0 auto;
}

/*---------------
------WiFi------
---------------*/
.service-wifi .fv {
	background: url(https://freedive.co.jp/wp-content/themes/freedive_original/assets/img/blog/bg_blog_pc.jpg) no-repeat center center/cover;
	min-height: auto;
}
.service-wifi .fv-inner {
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    max-width: 1200px;
    margin: auto;
    padding: 20px;
    height: 100%;
    min-height: 300px;
}
.service-wifi .fv-inner > * {
	width: auto;
}
.service-wifi .fv h1 span {
	background: #000;
    color: #fff;
    display: inline-block;
    font-family: YuGothic, "Yu Gothic medium", "Hiragino Sans", Meiryo, "sans-serif";
    font-size: 3.6rem;
    font-weight: bold;
    padding: 10px;
    margin-bottom: 15px;
}
.service-wifi .wifi .ttl_row {
	color: #000;
}
.service-wifi .ttl_row::before {
	background-image: linear-gradient(to right, rgb(119,118,255) 0%, rgb(174,44,241) 100%);
}
.wifi-list-item {
	display: flex;
	border: 1px solid #000;
	background: #fff;
}
.wifi-list-item + .wifi-list-item {
	margin-top: 40px;
}
.wifi-list-item img {
	width: 360px;
	height: auto;
}
.wifi-list-item p {
	width: calc(100% - 360px);
}
.wifi-list-item a {
	padding-left:10px;
	display: flex;
	align-items: center;
	width: 100%;
	height: 100%;
	color: #000;
	font-size: 1.6rem;
	line-height: 1.5;
	position: relative;
	padding-right:48px;
}
.wifi-list-item a::after {
	display: block;
	content: "";
	background: linear-gradient(to bottom left, rgba(255,255,255,0) 50%, rgb(119,118,255) 50.5%) no-repeat top left/100% 50%,
	linear-gradient(to top left, rgba(255,255,255,0) 50%, rgb(119,118,255) 50.5%) no-repeat bottom right/100% 50%;;
	width: 15px;
	height: 40px;
	position: absolute;
	right: 20px;
	top: 0;
	bottom: 0;
	margin: auto;
}
.wifi .whatsnew{
	margin-top:60px;
	padding:30px;
	background:#f5f5f5;
}
.wifi .whatsnew h3{
	font-size:3.0rem;
	text-align:center;
	font-weight:bold;
	position:relative;
	padding-bottom:20px;
	margin-bottom:12px;
}
.wifi .whatsnew h3::before{
	content:"";
	display:block;
	width:70px;
	height:2px;
	position:absolute;
	left:0;
	right:0;
	bottom:0;
	margin:auto;
	background-image:linear-gradient(to right, rgb(119,118,255) 0%, rgb(174,44,241) 100%);
}
.wifi .whatsnew div{
	max-height:160px;
	overflow-y:auto;
}
.wifi .whatsnew dl{
	padding-bottom:16px;
}
.wifi .whatsnew dl + dl{
	padding-top:16px;
	border-top:1px solid #ccc;
}
.wifi .whatsnew dt,
.wifi .whatsnew dd
{
	font-size:1.6rem;
	line-height:1.5;
	margin-top:8px;
}
.wifi .whatsnew a{
	font-size:1.6rem;
	line-height:1.5;
	color:#333;
	transition:300ms;
	display:inline;
}
.wifi .whatsnew a:hover{
	color:#aaa;
}
.wifi .whatsnew dd{
	text-align:justify;
}
/*------whatsnew css 引用------*/
div.whatsnew {
  margin: 10px 0;
  font-size: 100%;
  word-break: break-all;
  overflow: hidden;
}

div.whatsnew a {
  padding: 7px 0;
  display: block;
  text-decoration: none;
  box-shadow: none;
}

div.whatsnew a:hover {
  background-color: #f5f5f5;
  text-decoration: none;
  box-shadow: none;
}

div.whatsnew hr {
  margin: 0;
  padding: 0;
}

div.whatsnew .newmark {
  font-size: 74%;
  padding: 1px 5px;
  vertical-align: middle;
  color: White;
  background-color: #ff4500;
  border-radius: 3px;
}

div.whatsnew dl {
  margin: 0;
  padding: 0;
  border: 0;
}

div.whatsnew dt {
  padding: 0;
  border: 0;
  color: Gray;
  font-weight: normal;
  white-space: nowrap;
}

div.whatsnew dd {
  margin: 0;
  padding: 0 2px;
}

@media screen and (min-width: 600px) {
  div.whatsnew dl {
    overflow: hidden;
  }
  div.whatsnew dt {
  	margin: 0 0 0 0.3em;
    float: left;
    width: 8.1em;
    overflow: hidden;
  }
  div.whatsnew dd {
    overflow: hidden;
  }
}

/*------whatsnew css 引用 END------*/
@media screen and (max-width: 900px) {
	/*fv*/
	.fv-conts {
		flex-direction: column;
	}
	.fv-conts > .fv-text {
		width: 100%;
	}
	.fv-conts > .fv-img {
		width: 70%;
		margin: auto;
	}
	.fv-banner img.pc-only {
		display: none;
	}
	.fv-banner img.sp-only {
		display: block;
	}
	/*conts*/
	.conts {
		background-size: 15%;
	}
	/*point*/
	.point h2 {
		font-size: 2rem;
		margin-bottom: 40px;
	}
	.point_wrap {
		flex-direction: column;
	}
	.point_txt-box,
	.point-img {
		width: 100%;
	}
	.point:nth-of-type(even) .point_txt-box {
		order: 1;
	}
	.point:nth-of-type(even) .point-img {
		order: 2;
	}
	.point-txt {
		padding: 30px 15px 20px;
		margin-bottom: 10px;
		width: 100%;
	}
	.point-txt h3 {
		top: -10px;
	}
	.point-txt h3 span {
		font-size: 1.6rem;
		padding: 10px;
	}
	.point-img {
		flex-wrap: wrap;
	}
	.point-img li {
/*
		width: calc(100% / 2 - 10px);
*/
		margin-top: 20px;
	}
	/*summary*/
	.summary h2 {
		font-size: 2rem;
	}
	.summary p {
		font-size: 1.6rem;
	}
	/*catch*/
	.catch-cont {
		padding-left: 0;
	}
	.catch-cont h2 {
		font-size: 2rem;
	}
	.catch-cont p {
		font-size: 1.6rem;
	}
	.catch-list li {
		width: calc(100%/3 - 10px);
	}
	/*data*/
	.data p {
		font-size: 1.4rem;
	}
	/*voice*/
	.voice-box-inner {
		flex-direction: column;
		align-items: center;
	}
	.voice-prof {
		display: flex;
		margin-bottom: 10px;
		width: 100%;
	}
	.voice-prof > * {
		padding: 10px;
	}
	.voice-txt {
		width: 100%;
	}
	/*exception*/
	.pdca-list {
		width: calc(50% - 5px);
		font-size: 1.2rem;
		margin-bottom: 10px;
	}
	.pdca-inner h4 {
		font-size: 14rem;
	}
	.pdca-inner i {
		font-size: 4rem;
	}
	.regions {
		flex-direction: column;
	}
	.region {
		padding-bottom: 40px;
	}
	.region:last-child {
		padding-bottom: 20px;
	}
	.region::before, .region::after {
		width: calc(50% + 8px);
		height: 2px;
		top: auto;
		bottom: 40px;
	}
	.region::before {
		right: 0;
	}
	.region::after {
		left: 0;
	}
	.map_wrap {
		flex-direction: column;
	}
	.map_wrap > * {
		width: 100%;
	}
	.map_cats {
		margin-top: 40px;
	}
	/*---------------
	--------AD-------
	---------------*/
	.service-ad .fv-inner {
		flex-direction: column;
		height: auto;
	}
	.service-ad .fv-inner > * {
		width: 100%;
	}
	.service-ad .fv-img {
		order: 2;
		padding: 20px;
	}
	.service-ad .fv-text {
		order: 1;
		padding: 20px;
	}
	.service-ad h1 {
		font-size: 3rem;
	}
	.service-ad h1 em::after {
		content: "";
		display: block;
		background: #fff;
		height: 2px;
		width: 0;
		position: absolute;
		top: 1.1em;
		transition: .5s;
		transition-delay: 1s;
	}
	.service-ad h1 em::before,
	.service-ad h1 em::after {
		left: -2%;
	}
	.service-ad h1 em.inview::after {
		width: 110%;
	}

	#display {
		width: calc(100% - 40px);
		height: 55%;
		top: 20px;
	}
	.cause {
		margin-top: 20px;
	}
	.cause-inner {
		flex-direction: column;
	}
	.cause-inner figure {
		width: 70%;
		margin: auto;
	}
	.cause-inner h2 {
		font-size: 2rem;
		text-align: center;
		width: 100%;
	}
	.logic h2 {
		font-size: 2rem;
	}
	/*pyramid*/
	.c-pyramid-list .pyramid dd {
		display: none;
	}
	.c-pyramid-list {
		display: block;
		width: 310px;
		margin: 0 auto 30px;
		background-position: center center;
	}
	.pyramid dt {
		width: 100%;
		text-align: center;
	}
	.pyramid:first-child dt p {
		display: inline-block;
	}
	.c-pyramid-spList {
		display: block;
	}
	.img_c-pyramid .c-pyramid-cat p {
		margin: 0 auto;
	}
	.c-pyramid-cat dt {
		font-size: 1.6rem;
		font-weight: bold;
		width: 100%;
		margin: 15px auto 10px;
		text-align: center;
		line-height: 1.5;
	}
	.c-pyramid-cat dd {
		font-size: 1.4rem;
	}
	.c-pyramid-cat dd:last-child {
		display: flex;
		justify-content: space-between;
	}
	.c-pyramid-cat dd:last-child p {
		color: #444;
		font-weight: bold;
		font-size: 1.6rem;
		width: 7em;
	}
	.c-pyramid-cat dd:last-child ul {
		font-size: 1.6rem;
		width: calc(100% - 8em);
		list-style-type: square;
		line-height: 1.5;
		margin-left: 20px;
	}
	.c-pyramid-cat:nth-child(1) {
		color: #a519ff;
	}
	.c-pyramid-cat:nth-child(2) {
		color: #1c4eff;
	}
	.c-pyramid-cat:nth-child(3) {
		color: #0fe280;
	}
	.pyramid-desc {
		width: 100%;
	}
	.seo-flow_list ul li {
		padding: 5px;
	}
	.seo-flow_list ul li:first-child {
		padding: 5px 20%;
	}
	.adst-inner {
		flex-direction: column;
	}
	.adst-inner > div {
		width: 100%;
	}
	.adst-inner > div + div {
		margin-top: 30px;
	}
	.ad-strategy h2 {
		font-size: 3rem;
	}
	.cycle_pdca,
	.cycle_ooda {
		position: static;
	}
	.adst-inner .swiper-container {
		height: 350px;
	}
	.cycle_inner dt {
		font-size: 2rem;
	}
	.cycle_inner dt,
	.cycle_inner dd {
		padding: 10px;
	}
	.adst-inner > div:first-child {
		order: 1;
	}
	.cycle_pdca {
		order: 2;
	}
	.ad-st_exp {
		margin-top: 0;
		order: 3;
	}
	.cycle_ooda {
		order: 4;
	}
	.ad-a_inner {
		flex-direction: column;
	}
	.ad-analytics h2 {
		writing-mode: horizontal-tb;
	}
	.ad-a_txt {
		padding: 20px 20px 30px;
	}
	.ad-a_inner > div:nth-child(1) {
		top: auto;
		bottom: -20px;
	}
	.ad-a_inner > div:nth-child(3) {
		bottom: auto;
		top: -20px;
	}
/*Dualfanel*/
.img_dual-funnel {
	position: relative;
}
.img_df-ttl {
	display: flex;
	justify-content: space-between;
	align-items: center;
}
.img_dual-funnel .img_df-ttl h4 {
	padding: 10px;
	width: calc(100%/7*3 - 5px);
	position: relative;
}
.img_dual-funnel .img_df-ttl h4:first-child {
	color: #E88181;
	border-bottom: 1px solid #E88181;
}
.img_dual-funnel .img_df-ttl h4:last-child {
	color: #81B2E8;
	border-bottom: 1px solid #81B2E8;
}
.img_dual-funnel .img_df-ttl h4:first-child::before,
.img_dual-funnel .img_df-ttl h4:last-child::before {
	content: "";
	display: block;
	width: 20px;
	height: 1px;
	position: absolute;
	bottom: 0;
	right: 0;
	transform: rotate(45deg);
	transform-origin: right bottom;
}
.img_dual-funnel .img_df-ttl h4:first-child::before {
	background: #E88181;
}
.img_dual-funnel .img_df-ttl h4:last-child::before {
	background: #81B2E8;
}
.img_df-list {
	display: flex;
	justify-content: space-between;
	align-items: center;
}
.img_df-list li {
	width: calc(100%/7 - 5px);
	position: relative;
	overflow: hidden;
}
.img_df-list li::before,
.img_df-list li::after {
	display: block;
	content: "";
	background: #fff;
	width: 120%;
	height: 40px;
	position: absolute;
	left: -10%;
	right: auto;
}
.img_df-list .img_df-nc-part::before {
	top: -20px;
	transform: rotate(10deg);
}
.img_df-list .img_df-nc-part::after {
	bottom: -20px;
	transform: rotate(-10deg);
}
.img_df-list .img_df-ec-part::before {
	top: -20px;
	transform: rotate(-10deg);
}
.img_df-list .img_df-ec-part::after {
	bottom: -20px;
	transform: rotate(10deg);
}
.img_dual-funnel .img_df-list li h5 {
	color: #fff;
	text-align: center;
	margin: auto;
}
.img_df-list li:nth-child(1) {
	background: #E88181;
	padding: 90px 0;
}
.img_df-list li:nth-child(2) {
	background: #E8A381;
	padding: 65px 0;
}
.img_df-list li:nth-child(3) {
	background: #E8D581;
	padding: 40px 0;
}
.img_df-list li:nth-child(4) {
	background: #aaa;
	padding: 5px 0;
}
.img_df-list li:nth-child(4)::before,
.img_df-list li:nth-child(4)::after {
	display: none;
}
.img_df-list li:nth-child(5) {
	background: #81B2E8;
	padding: 40px 0;
}
.img_df-list li:nth-child(6) {
	background: #B181E8;
	padding: 53px 0;
}
.img_df-list li:nth-child(7) {
	background: #E881C7;
	padding: 90px 0;
}
.img_df-ttl {
	position: absolute;
	width: 100%;
	height: 100%;
	z-index: 2;
	left: 0;
	right: 0;
	margin: auto;
}
.img_dual-funnel .img_df-ttl h4 {
	font-size: 1.6rem;
	writing-mode: vertical-rl;
	padding: 0 0 20px;
	width: auto;
	margin: 0;
}
.img_dual-funnel .img_df-ttl h4:first-child {
	border-bottom: none;
	border-right: 1px solid #E88181;
	align-self: flex-start;
}
.img_dual-funnel .img_df-ttl h4:last-child {
	border-bottom: none;
	border-left: 1px solid #81B2E8;
	text-align: end;
	align-self: flex-end;
}
.img_dual-funnel .img_df-ttl h4:last-child::before {
	left: 0;
	right: auto;
	transform: rotate(-45deg);
	transform-origin: left bottom;
}
.img_df-list {
	background: #fff;
	flex-direction: column;
}
.img_df-list li::before,
.img_df-list li::after {
	width: 20%;
	height: 125%;
}
.img_df-list li + li {
	margin-top: 5px;
}
.img_df-list .img_df-nc-part::before {
	top: -5%;
	bottom: auto;
	right: auto;
	left: -10%;
	transform: rotate(-10deg);
}
.img_df-list .img_df-nc-part::after {
	top: -5%;
	bottom: auto;
	left: auto;
	right: -10%;
	transform: rotate(10deg);
}
.img_df-list .img_df-ec-part::before {
	top: -15%;
	bottom: auto;
	right: auto;
	left: -10%;
	transform: rotate(10deg);
}
.img_df-list .img_df-ec-part::after {
	top: -15%;
	bottom: auto;
	left: auto;
	right: -10%;
	transform: rotate(-10deg);
}
.img_dual-funnel .img_df-list h5 {
	line-height: 2.5;
}
.img_dual-funnel .img_df-list .img_df-row2 {
	line-height: 1.25;
}
.img_df-list li:nth-child(1) {
	width: 90%;
	padding: 0;
}
.img_df-list li:nth-child(2) {
	width: 80%;
	padding: 0;
}
.img_df-list li:nth-child(3) {
	width: 70%;
	padding: 0;
}
.img_df-list li:nth-child(4) {
	width: 50%;
	padding: 0;
}
.img_df-list li:nth-child(4)::before,
.img_df-list li:nth-child(4)::after {
	display: none;
}
.img_df-list li:nth-child(5) {
	width: 70%;
	padding: 0;
}
.img_df-list li:nth-child(6) {
	width: 80%;
	padding: 0;
}
.img_df-list li:nth-child(7) {
	width: 90%;
	padding: 0;
}
	.pyramid-desc {
		margin-bottom: 50px;
	}
	.ad-summary_txtBox {
		flex-direction: column;
	}
	.ad-summary_txtBox li:first-child,
	.ad-summary_txtBox li:last-child {
		width: 100%;
	}
	.ad-summary_shapeBg {
		padding: 0;
	}
	.ad-summary li h2 {
		width: 100%;
	}
	.ad-summary_txtTtl li:last-child {
		position: static;
	}
	.ad-summary li img {
		width: 75%;
		margin: auto;
	}
	.ad-summary_txtDetail li:first-child {
		padding: 0;
		margin-bottom: 20px;
	}
	/*---------------
	-----WEBSITE-----
	---------------*/
	.service-website .fv-conts > .fv-img {
		width: 100%;
	}
	.code:nth-of-type(2) {
		width: 25ch;
		-webkit-animation: typing 7s steps(25, end),
		blink-caret .5s step-end infinite alternate;
	}
	.ask h2 {
		font-size: 3rem;
		line-height: 1.5;
	}
	.trouble {
		width: 100%;
		padding: 25px;
		font-size: 1.6rem;
	}
	.trouble::before, .trouble::after {
		opacity: .5;
		font-size: 6rem;
	}
	.exp_box {
		flex-direction: column;
	}
	.exp_box > * {
		width: 100%;
	}
	.exp_img {
		order: 1;
	}
	.exp_img img {
		position: relative;
		width: 100%;
	}
	.exp_txt {
		order: 2;
		margin-top: 20px;
	}
	.pm {
		margin-top: 30px;
	}
	.pm h2 {
		height: 80px;
		text-align: center;
		position: relative;
		width: 95%;
		margin: auto;
		top: 0;
	}
	.pm h2::before {
		background: url("../../img/service/website/pm_ttl-bg1.svg") no-repeat left top / contain, url("../../img/service/website/pm_ttl-bg2.svg") no-repeat right bottom 5% / 30%;
		width: 100%;
		left: 0;
	}
	.pm h2 span {
		font-size: 2rem;
	}
	.pm-img-list {
		width: 100%;
		padding: 0 20px;
		flex-direction: column;
		margin-top: 50px;
	}
	.pm-img-list li {
		width: 100%;
	}
	.pm-img-list li::before {
		width: 100%;
		height: 100%;
		left: 0;
		top: 0;
	}
	.pm-img-list li + li {
		margin-top: 20px;
	}
	.pm-img-list li:nth-child(2) {
		top: 0;
	}
	.pm-img-list li:nth-child(3) {
		left: 0;
		margin-top: 20px;
	}
	.pm_txt {
		position: relative;
		width: calc(100% - 40px);
		margin: auto;
	}
	.seo h2 {
		font-size: 2.4rem;
		padding: 110px 0 0;
	}
	.seo h2::before,
	.seo h2::after {
		width: 50%;
		height: 100px;
		top: 0;
	}
	.seo h2::before {
		right: auto;
		left: 0;
	}
	.seo h2::after {
		left: auto;
		right: 0;
	}
	.seo h3 {
		font-size: 2rem;
		margin: 30px auto;
	}
	.seo_detail h4 {
		font-size: 1.6rem;
		padding: 15px;
		position: static;
		width: 100%;
		margin-bottom: 20px;
	}
	.seo_detail p {
		margin-bottom: 30px;
	}
	.seo_detail li::before {
		font-size: 2rem;
	}
	.seo_detail li::after {
	content: "";
	display: block;
	border-radius: 50%;
	position: absolute;
	width: 14px;
	height: 14px;
	left: 25px;
    top: 27px;
	}
	.seo_detail li h5::before, .seo_detail li h5::after {
		display: none;
	}
	.seo-writing {
		flex-direction: column;
	}
	.seo-writing > * {
		width: 100%;
	}
	.seo-writing_txt p {
		position: static;
	}
	.seo-writing_img li {
		padding: 20px 0 0 20px;
	}
	.seo_detail li h5 {
		padding-top: 20px;
	}
	.seo-writing li::after {
		background: #13d5df;
	}
	.seo-site_txt {
		flex-direction: column;
		margin-bottom: 10px;
	}
	.seo-site_txt p {
		width: 100%;
		position: static;
	}
	.seo-site_img {
		flex-direction: column;
		width: 85%;
		margin: 0 auto;
	}
	.seo-site_img li {
		width: 100%;
		padding: 20px 0 0 20px;
	}
	.seo-site_img li::after {
		background: #f610ff;;
	}
	.seo-site_img img {
		width: 75%;
		margin: 0 auto;
	}
	.appeal h2 {
		width: 3em;
		font-size: 3rem;
		top: -50px;
		right: 15px;
		line-height: 1.25;
	}
	.appeal_txtbox {
		width: calc(100% - 80px);
	}
	.appeal_txt {
		padding: 20px;
	}
	.strength h2 {
		font-size: 2rem;
		line-height: 1.5;
	}
	.strength h2 span {
		margin-top: 10px;
		font-size: 3rem;
	}
	.st_flow {
		background: none;
		height: auto;
	}
	.st_flow li {
		position: static;
		width: 100%;
	}
	.st_flow li + li {
		margin-top: 30px;
	}
	.st_flow li i {
		display: block;
		font-size: 5rem;
		color: #9800bf;
		position: relative;
		text-align: center;
		width: 1em;
		margin: auto;
		bottom: -25px;
	}
	.closing h2 {
		width: 100%;
	}
	.closing p {
		width: calc(100% - 40px);
		margin: auto;
		padding: 15px;
	}
	.wifi-list-item {
		flex-direction: column;
	}
	.wifi-list-item img {
		width: 100%;
	}
	.wifi-list-item p {
		width: 100%;
		padding: 0 20px 40px;
		text-align: center;
	}
	.wifi-list-item a {
		justify-content: center;
		padding-right:0;
	}
	.wifi-list-item a::after {
		background: linear-gradient(to top right, rgba(255,255,255,0) 50%, rgb(119,118,255) 50.5%) no-repeat top left/50% 100%,
		linear-gradient(to top left, rgba(255,255,255,0) 50%, rgb(119,118,255) 50.5%) no-repeat top right/50% 100%;;
		width: 40px;
		height: 15px;
		right: 0;
		left: 0;
		bottom: -25px;
		top: auto;
	}
}
