@charset "UTF-8";


/*ーーーーーーーーーーーーーーーーーーーーーーーー
 カスタムプロパティ
ーーーーーーーーーーーーーーーーーーーーーーーー */

:root {
  --color-main: #17BEDD;
}




/*ーーーーーーーーーーーーーーーーーーーーーーーー
フォント
ーーーーーーーーーーーーーーーーーーーーーーーー*/

/* 全体フォント調整
ーーーーーーーーーーーーーーーーーーーーーーーー */
p,ul,ol,dl,dt,dd,li,
table,th,td {
font-size:16px;
}
p,ul,li {
margin: 0px;
padding: 0px;
list-style: none;
}




/*行間設定
ーーーーーーーーーーーーーーーーーーーーーーーー*/

h1,h2,h3,h4,h5,h6 {
line-height:1.3;
}
p,th,td,caption,
ul,ol,li,
dl,dt,dd {
line-height:1.8;
}





/* ーーーーーーーーーーーーーーーーーーーーーーーー
レイアウト
ーーーーーーーーーーーーーーーーーーーーーーーー */



/* キービジュアル
ーーーーーーーーーーーーーーーーーーーーーーーー*/

.lay100 {
max-width: 1500px;
margin: 0 auto;
display: grid;
place-items: center;
justify-content: center;
}
.lay100 > * {
  grid-area: 1 / 1;
}
.lay100 h1 {
font-size: 50px;
font-weight: 600;
font-family: "Hiragino Mincho ProN", "Hiragino Mincho Pro", "Yu Mincho", "MS PMincho", "Noto Serif JP", "Serif", serif;
z-index: 2;
justify-self: start;
}
.lay100 h1 span {
display: inline-block;
background:#fff;
margin: 4px 0px;
padding: 0px 20px;
}
.lay100 p {
  grid-area: 1 / 1;
  z-index: 1;
}

		@media screen and (max-width:743px) {
		.lay100 {
		max-width: initial;
		display: block;
		position: relative;
		}
		.lay100 h1 {
		font-size: 24px;
		z-index: 2;
		position: absolute;
		top: 60px;
		}
		.lay100 h1 span {
		display: inline-block;
		background:#fff;
		margin: 4px 0px;
		padding: 0px 10px;
		}
		/*smp end*/}

		@media screen and (max-width:393px) {
		.lay100 h1 {
		font-size: 22px;
		z-index: 2;
		position: absolute;
		top: 60px;
		}
		/*smp end*/}





/* こんなお悩みはありませんか？
ーーーーーーーーーーーーーーーーーーーーーーーー */

/* 枠 */
.lay101 .boxa {
width: 1200px;
margin: 0 auto;
display: flex;
justify-content: space-between;
align-items: flex-start;
}
.lay101 .boxa .wrpa {
border: solid 1px var(--color-main);
border-radius: 25px;
padding: 20px;
width: 32%;
margin-top: 95px;
position: relative;
}
.lay101 .boxa .wrpa:nth-child(2) {
margin-top: 0px;
}

/* 吹き出し */
.lay101 .boxa .wrpa::after {
width: 43px;
height: 55px;
content: "";
display: inline-block;
background: url(https://s3-ap-northeast-1.amazonaws.com/s3.peraichi.com/userData/4549fcce-325d-4c9c-b26b-fc5ddbefcb97/img/5b390ed0-0e29-013e-47f8-0a58a9feac02/icon_balloon.png) no-repeat center center;
position: absolute;
bottom: -65px;
}
.lay101 .boxa .wrpa:first-child::after {
right: 60px;
transform: scaleX(-1);
}
.lay101 .boxa .wrpa:nth-child(2)::after {
right: 60px;
}
.lay101 .boxa .wrpa:last-child::after {
left: 60px;
}

/* テキスト */
.lay101 .boxa .wrpa p {
font-size: 16px;
}
.lay101 .boxa .wrpa p:first-child {
font-size: 18px;
font-weight: 600;
color: var(--color-main);
margin-bottom: 10px;
line-height: 1.6;
}

/* 画像 */
.lay101 .boxb {
text-align: center;
position: relative;
top: 0px;
}

		@media screen and (max-width:743px) {
		/* 枠 */
		.lay101 .boxa {
		width: auto;
		display: block;
		margin-right: 20px;
		margin-left: 20px;
		}
		.lay101 .boxa .wrpa {
		width: 80%;
		margin-top: 0px;
		margin-bottom: 80px;
		position: relative;
		}
		.lay101 .boxa .wrpa:nth-child(2) {
		margin-right: 0px;
		margin-left: auto;
		}

		/* 吹き出し */
		.lay101 .boxa .wrpa:last-child::after {
		transform: scaleX(-1);
		}
		/* 画像 */
		.lay101 .boxb {
		width: 90%;
		margin-right: auto;
		margin-left: auto;
		}
		/*smp end*/}




/* 成果を生み出すツール
ーーーーーーーーーーーーーーーーーーーーーーーー */
.lay102 {
background: #f5f5f5 url(https://s3-ap-northeast-1.amazonaws.com/s3.peraichi.com/userData/4549fcce-325d-4c9c-b26b-fc5ddbefcb97/img/6c3a9340-0e29-013e-4800-0a58a9feac02/seika_bg.png) no-repeat center top;
height: 1890px;
}
.lay102 .seca {
width: 1270px;
margin: 0 auto;
}
.lay102 h2 {
text-align: center;
font-size: 40px;
font-weight: 600;
padding: 72px 0px 22px;
}
.lay102 h2 span {
color: var(--color-main);
}
.lay102 h2 span.txta {
font-size: 56px;
padding: 0px 3px;
}

.lay102 .boxa,
.lay102 .boxb,
.lay102 .boxc,
.lay102 .boxd {
display:flex;
flex-direction: column;
justify-content: center;
box-sizing: border-box;
padding-left: 300px;
margin-top: 50px;
/* background: rgba(0, 0, 0, 0.2); */
}

.lay102 .boxa {
width: 955px;
height: 315px;
}
.lay102 .boxb {
width: 780px;
height: 335px;
margin-left: 460px;
}
.lay102 .boxc {
width: 790px;
height: 315px;
}
.lay102 .boxd {
width: 980px;
height: 285px;
margin-left: 260px;
}


.lay102 h3 {
display: inline-block;
font-size: 34px;
font-weight: 600;
margin-bottom: 20px;
}
.lay102 h3 span {
background-image: linear-gradient(#abeef7, #abeef7);
background-repeat: no-repeat;
background-size: 100% 0.4em;
background-position: 0 90%;
padding-bottom: 0.1em;
}

		@media screen and (max-width:743px) {
		.lay102 {
		background: #f5f5f5 url(https://s3-ap-northeast-1.amazonaws.com/s3.peraichi.com/userData/4549fcce-325d-4c9c-b26b-fc5ddbefcb97/img/5b37b830-0e29-013e-ea55-0a58a9feac02/seika_bg_smp.png) no-repeat center top / cover;
		height: 567.43vw;/* 2230px */
		}
		.lay102 .seca {
		width: auto;
		margin: 0 auto;
		}
		.lay102 h2 {
		font-size: 32px;
		padding: 8.14vw 0px 8.05vw;/* 32px 0px 12px */
		line-height: 1.5;
		}
		.lay102 h2 span.txta {
		font-size:38px;
		}

		.lay102 .boxa,
		.lay102 .boxb,
		.lay102 .boxc,
		.lay102 .boxd {
		display:block;
		padding-left: 0px;
		padding-top: 40.8vw;/* 180px */
		margin: 5.09vw auto 0px;/* 20px auto 0px */
		text-align: center;
		/* background: rgba(0, 0, 0, 0.2); */
		}

		.lay102 .boxa {
		width: 80%;
		height: 123.41vw;/* 485px */
		}
		.lay102 .boxb {
		width: 80%;
		height: 114.5vw;/* 450px */
		margin-left: auto;
		}
		.lay102 .boxc {
		width: 80%;
		height: 117.05vw;/* 460px */
		}
		.lay102 .boxd {
		width: 80%;
		height: 118.32vw;/* 465px */
		margin-left: auto;
		}


		.lay102 h3 {
		font-size: 24px;
		}
		.lay102 p {
		font-size: 14px;
		}
		/*smp end*/}




/* 素材づくりから丁寧にお手伝い
ーーーーーーーーーーーーーーーーーーーーーーーー */

.lay103 {
border-top: solid 5px #f5f5f5;
border-bottom: solid 5px #f5f5f5;
display: flex;
padding: 50px 0px;
align-items: center;
justify-content: center;
}

.lay103 + .lay103 {
margin-top: 100px;
padding: 0px;
}
.lay103 p:first-child {
display: none;
}
.lay103 .boxa {
width: 360px;
padding: 30px;
}
.lay103 h3 {
font-size: 26px;
font-weight: 600;
line-height: 1.6;
margin-bottom: 20px;
}
.lay103 h3 span {
color: var(--color-main);
}

		@media screen and (max-width:743px) {
		.lay103 {
		display: block;
		padding: 0px 0px 30px;
		}
		.lay103 + .lay103 {
		margin-top: 30px;
		padding: 0px 0px 50px;
		border-top: none;
		}
		.lay103 > p {
		display: none;
		}
		.lay103 p:first-child {
		display: block;
		}
		.lay103 .boxa {
		width: 80%;
		padding: 30px 0px 0px;
		margin: 0 auto;
		text-align: center;
		}
		.lay103 h3 {
		font-size: 24px;
		}

		/*smp end*/}



/* 取引先実績（一部）
ーーーーーーーーーーーーーーーーーーーーーーーー */

.lay104 {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
width: 1100px;
margin: 0 auto;
}
.lay104 p {
width: 100%;
}

.lay104 ul {
width: 33.3%;
}
.lay104 li {
margin-top: 5px;
}
.lay104 li::before {
content: "● ";
color:var(--color-main);
font-size: 12px;
}

		@media screen and (max-width:743px) {
		.lay104 {
		display: block;
		width: auto;
		margin-right: 20px;
		margin-left: 20px;
		}
		.lay104 ul {
		width: auto;
		}
		/*smp end*/}


/* パンフレット制作の流れ
ーーーーーーーーーーーーーーーーーーーーーーーー */

.lay105 {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
width: 1270px;
margin: 0 auto;
}
.lay105 .boxa {
width: 25%;
min-width: 253px;
background: url(https://s3-ap-northeast-1.amazonaws.com/s3.peraichi.com/userData/4549fcce-325d-4c9c-b26b-fc5ddbefcb97/img/5b38de80-0e29-013e-3b30-0a58a9feac02/flow_arrow.png) no-repeat right center;
box-sizing: border-box;
padding: 0px 30px 0px 20px;
}
.lay105 .boxa:last-child {
background:none;
}

.lay105 .boxa p:first-child {
font-size: 40px;
font-weight: 600;
color: var(--color-main);
}
.lay105 .boxa h3 {
font-size: 25px;
font-weight: 600;
display: inline-block;
background-image: linear-gradient(#abeef7, #abeef7);
background-repeat: no-repeat;
background-size: 100% 0.4em;
background-position: 0 90%;
padding-bottom: 0.1em;
}
.lay105 .boxa h3 + p {
margin-top: 20px;
}
.lay105 .boxa .txta {
font-size: 12px;
text-indent: -1em;
margin-left: 1em;
margin-top: 5px;
}

		@media screen and (max-width:743px) {
		.lay105 {
		display: block;
		width: auto;
		margin: 0 20px;
		}
		.lay105 .boxa {
		width: auto;
		min-width: initial;
		background: url(https://s3-ap-northeast-1.amazonaws.com/s3.peraichi.com/userData/4549fcce-325d-4c9c-b26b-fc5ddbefcb97/img/5b5782b0-0e29-013e-47f9-0a58a9feac02/flow_arrow_bottom.png) no-repeat center bottom / 90% auto;
		box-sizing: border-box;
		padding: 20px 0px 40px 0px;
		text-align: center;
		}
		.lay105 .boxa:last-child {
		background:none;
		}

		.lay105 .boxa p:first-child {
		font-size: 40px;
		font-weight: 600;
		color: var(--color-main);
		}
		.lay105 .boxa h3 {
		font-size: 25px;
		font-weight: 600;
		display: inline-block;
		background-image: linear-gradient(#abeef7, #abeef7);
		background-repeat: no-repeat;
		background-size: 100% 0.4em;
		background-position: 0 90%;
		padding-bottom: 0.1em;
		}
		.lay105 .boxa h3 + p {
		margin-top: 20px;
		}
		.lay105 .boxa .txta {
		font-size: 12px;
		text-indent: -1em;
		margin-left: 1em;
		margin-top: 5px;
		}
		/*smp end*/}




/* 企業の思いが伝わるパンフレット
ーーーーーーーーーーーーーーーーーーーーーーーー */

.lay106 {
background: #f7f7f7;
padding: 100px 0px;
}
.lay106 h2 {
font-size: 40px;
font-weight: 600;
text-align: center;
}
.lay106 h2 span {
color: var(--color-main);
}
.lay106 .boxa {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
width: 1270px;
margin: 40px auto 0px;
}
.lay106 .boxa .wrpa {
width: 33%;
border-left: solid 1px #b3b3b3;
box-sizing: border-box;
padding: 0 20px;
text-align: center;
}
.lay106 .boxa .wrpa:last-child {
border-right: solid 1px #b3b3b3;
}
.lay106 .boxa .wrpa h3 {
font-size: 25px;
font-weight: 600;
margin: 20px 0px 10px;
}

		@media screen and (max-width:743px) {
		.lay106 {
		padding: 50px 0px;
		}
		.lay106 h2 {
		font-size: 32px;
		line-height: 1.5;
		}

		.lay106 .boxa {
		display: block;
		width: auto;
		margin: 40px 20px 0px;
		}
		.lay106 .boxa .wrpa {
		width: auto;
		border-left: none;
		padding: 0px;
		margin-top: 40px;
		}
		.lay106 .boxa .wrpa:last-child {
		border-right: none;
		}
		/*smp end*/}



/* PRICE（プライス）
ーーーーーーーーーーーーーーーーーーーーーーーー */

.lay107 {
width: 1000px;
margin: 0 auto;
}
.lay107 th,
.lay107 td {
white-space: nowrap;
border-bottom: solid 1px #e7e1e1;
padding: 15px;
}
.lay107 th {
font-weight: 600;
text-align: center;
}
.lay107 td:nth-child(2),
.lay107 td:nth-child(4) {
text-align: center;
}
.lay107 span.display_pc {
display: inline;
}


		@media screen and (max-width:743px) {
		table.lay107 {display: table;}
		.lay107 tbody {display: table-row-group;}
		.lay107 tr {display: table-row;}
		.lay107 th {display: table-cell;}
		.lay107 td {display: table-cell; }

		table.lay107,
		.lay107 tbody,
		.lay107 tr,
		.lay107 th,
		.lay107 td {
		width: auto !important;
		min-width: initial !important;
		}
		.lay107 th,
		.lay107 td {
		white-space: nowrap;
		border-bottom: solid 1px #e7e1e1;
		padding: 10px;
		font-size: 14px;
		line-height: 1.4;
		}
		.lay107 th {
		font-weight: 600;
		text-align: center;
		}
		.lay107 span.display_pc {
		display: none;
		}
		/*smp end*/}






/* ーーーーーーーーーーーーーーーーーーーーーーーー
モジュール
ーーーーーーーーーーーーーーーーーーーーーーーー */


/*表示切り替え
ーーーーーーーーーーーーーーーーーーーーーーーー*/

.display_pc {display:block;}
.display_smp {display:none;}
img.display_pc {display:inline-block;}
img.display_smp {display:none;}

		@media screen and (max-width:743px) {
		.display_pc {display:none;}
		.display_smp {display:block;}
		img.display_pc {display:none;}
		img.display_smp {display:inline-block;}
		/*smp end*/}





/*スペース調整
ーーーーーーーーーーーーーーーーーーーーーーーー*/

.mt0 {margin-top: 0px !important;}
.mt5 {margin-top: 5px !important;}
.mt10 {margin-top: 10px !important;}
.mt15 {margin-top: 15px !important;}
.mt20 {margin-top: 20px !important;}
.mt25 {margin-top: 25px !important;}
.mt30 {margin-top: 30px !important;}
.mt35 {margin-top: 35px !important;}
.mt40 {margin-top: 40px !important;}
.mt45 {margin-top: 45px !important;}
.mt50 {margin-top: 50px !important;}
.mt55 {margin-top: 55px !important;}
.mt60 {margin-top: 60px !important;}
.mt65 {margin-top: 65px !important;}
.mt70 {margin-top: 70px !important;}
.mt75 {margin-top: 75px !important;}
.mt80 {margin-top: 80px !important;}
.mt85 {margin-top: 85px !important;}
.mt90 {margin-top: 90px !important;}
.mt95 {margin-top: 95px !important;}
.mt100 {margin-top: 100px !important;}
.mt110 {margin-top: 110px !important;}
.mt120 {margin-top: 120px !important;}
.mt130 {margin-top: 130px !important;}
.mt140 {margin-top: 140px !important;}
.mt150 {margin-top: 150px !important;}
.mt160 {margin-top: 160px !important;}
.mt170 {margin-top: 170px !important;}
.mt180 {margin-top: 180px !important;}
.mt190 {margin-top: 190px !important;}
.mt200 {margin-top: 200px !important;}

.mr0 {margin-right: 0px !important;}
.mr5 {margin-right: 5px !important;}
.mr10 {margin-right: 10px !important;}
.mr15 {margin-right: 15px !important;}
.mr20 {margin-right: 20px !important;}
.mr25 {margin-right: 25px !important;}
.mr30 {margin-right: 30px !important;}
.mr35 {margin-right: 35px !important;}
.mr40 {margin-right: 40px !important;}
.mr45 {margin-right: 45px !important;}
.mr50 {margin-right: 50px !important;}
.mr55 {margin-right: 55px !important;}
.mr60 {margin-right: 60px !important;}
.mr60 {margin-right: 65px !important;}
.mr70 {margin-right: 70px !important;}
.mr75 {margin-right: 75px !important;}
.mr80 {margin-right: 80px !important;}
.mr85 {margin-right: 85px !important;}
.mr90 {margin-right: 90px !important;}
.mr95 {margin-right: 95px !important;}
.mr100 {margin-right: 100px !important;}

.mb0 {margin-bottom: 0px !important;}
.mb5 {margin-bottom: 5px !important;}
.mb10 {margin-bottom: 10px !important;}
.mb15 {margin-bottom: 15px !important;}
.mb20 {margin-bottom: 20px !important;}
.mb25 {margin-bottom: 25px !important;}
.mb30 {margin-bottom: 30px !important;}
.mb35 {margin-bottom: 35px !important;}
.mb40 {margin-bottom: 40px !important;}
.mb45 {margin-bottom: 45px !important;}
.mb50 {margin-bottom: 50px !important;}
.mb55 {margin-bottom: 55px !important;}
.mb60 {margin-bottom: 60px !important;}
.mb60 {margin-bottom: 65px !important;}
.mb70 {margin-bottom: 70px !important;}
.mb75 {margin-bottom: 75px !important;}
.mb80 {margin-bottom: 80px !important;}
.mb85 {margin-bottom: 85px !important;}
.mb90 {margin-bottom: 90px !important;}
.mb95 {margin-bottom: 95px !important;}
.mb100 {margin-bottom: 100px !important;}
.mb110 {margin-bottom: 110px !important;}
.mb120 {margin-bottom: 120px !important;}
.mb130 {margin-bottom: 130px !important;}
.mb140 {margin-bottom: 140px !important;}
.mb150 {margin-bottom: 150px !important;}
.mb160 {margin-bottom: 160px !important;}
.mb170 {margin-bottom: 170px !important;}
.mb180 {margin-bottom: 180px !important;}
.mb190 {margin-bottom: 190px !important;}
.mb200 {margin-bottom: 200px !important;}

.ml0 {margin-left: 0px !important;}
.ml5 {margin-left: 5px !important;}
.ml10 {margin-left: 10px !important;}
.ml15 {margin-left: 15px !important;}
.ml20 {margin-left: 20px !important;}
.ml25 {margin-left: 25px !important;}
.ml30 {margin-left: 30px !important;}
.ml35 {margin-left: 35px !important;}
.ml40 {margin-left: 40px !important;}
.ml45 {margin-left: 45px !important;}
.ml50 {margin-left: 50px !important;}
.ml55 {margin-left: 55px !important;}
.ml60 {margin-left: 60px !important;}
.ml60 {margin-left: 65px !important;}
.ml70 {margin-left: 70px !important;}
.ml75 {margin-left: 75px !important;}
.ml80 {margin-left: 80px !important;}
.ml85 {margin-left: 85px !important;}
.ml90 {margin-left: 90px !important;}
.ml95 {margin-left: 95px !important;}
.ml100 {margin-left: 100px !important;}