/* =======================================================
*
* 	Campaign
*
* ======================================================= */
p, span, th, td{color:#464646;}
#wrap p{margin:0;}
#wrap img{max-width:100%;}
#wrap .inBlock{display:inline-block; margin:0;}
#wrap .bold{font-weight:bold; margin:0;}

#mainVisual .txt, 
#effect .txt, 
#service .outer p, #service .outer span, #service .tit, #service th, #service td{font-family: "Playfair Display", Arial, serif;}

#effect .imgBox figcaption,
#service h3{font-family: 'EB Garamond', serif;}

#mainVisual{position:relative; z-index:1;}
#mainVisual .outer{position:absolute; left:0; width:100%; top: 50%;  -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%);}
#mainVisual .container2{max-width:1200px; padding:0; text-align:center;}
#mainVisual .cap{font-size:10px; position:absolute; bottom:5px; left:5px; color:#fff; font-weight:bold; text-shadow: 0 0 9px rgba(0,0,0,1);}
#mainVisual h2{margin:0 0 10px; padding: 0 10px;}
#mainVisual .txt{font-size:16px; text-shadow: 0 0 5px rgba(255,255,255,1), 1px 1px rgba(255,255,255,0.5);}

#effect{background:#2a3648; padding:0 0 80px;}
#effect p, #effect span{color:#fff;}
#effect h3{margin:-30px 0 0 0; position:relative; z-index:10; text-align: center;}
#effect .tit{margin:-25px 0 5px 0; text-align:center;}
#effect .tit, #effect .tit span{font-size:36px; line-height:1.4;}
#effect .txt{margin:0 0 35px; text-align:center;}
#effect .imgBox{max-width:1040px; width:100%; text-align:center; margin:0 auto;}
#effect .imgBox .img{width:44.23%; float:left;}
#effect .imgBox .img:nth-of-type(1){position:relative;}
#effect .imgBox .img:nth-of-type(1):after{position:absolute; top:50%; right:-17%; margin:-26px 0 0 0; width:30px; height:52px; content:''; background:url(../campaign/images/effect_arrow.png) no-repeat;}
#effect .imgBox .img:nth-of-type(2){float:right;}
#effect .imgBox figure{position:relative;}
#effect .imgBox figcaption{position:absolute; bottom:-0.6em; left:-0.3em; font-size:40px; line-height:1; text-shadow: 0 0 9px rgba(0,0,0,1); color:#fff; text-align:left; letter-spacing:0.15em;}
#effect .imgBox figcaption::first-letter{font-size:58px;}
#effect .imgBox p{text-align:right; font-size:10px; line-height:1.4; padding:8px 0 0 0; font-weight:bold;}

#service{padding:50px 0 100px;}
#service h3{font-size:38px; line-height:1; padding:30px; background:#e2f4f7; margin:0 0 30px;}
#service .outer{border:3px solid #5cc2cf; padding:2px; margin:0 0 70px;}
#service .outer p, #service .outer span, #service .outer h4, #service .outer h5, #service .outer h6{font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", Osaka, Arial, Helvetica, Verdana, sans-serif;}
#service .inner{border:1px solid #5cc2cf; padding:30px;}
#service h4, #service h4 span{color:#fff; text-align:center; line-height:1.8; font-weight:bold;}
#service h4{background:#5cc2cf; padding:20px; margin:0 0 25px;}
#service h4 span{font-size:24px; margin:0; display:block;}
#service h4 br{display:none;}
#service h5{font-size:32px; color:#e1463c; line-height:1.5; font-weight:bold; margin:0;}
#service h6{color:#5cc2cf; font-size:24px; font-weight:bold; margin:0 0 10px;}
#service h6 span{color:#e05c53; font-weight:bold; margin:0; font-size:24px;}
#service h6 .num{font-size:34px;}
#service .txtLabel{line-height:1.5; color:#fff; background:#334157; margin:0 0 10px; padding:5px 15px; display:inline-block;
border-radius:20px; -webkit-border-radius:20px; -moz-border-radius:20px;}
#service .box{margin:0 0 40px;}
#service .box p{font-size:16px;}
#service .boxL{width:50%; float:left;}
#service .boxR{width:46.1%; float:right;}
#service .box01 p.txt{font-size:20px;}
#service .box04 p{font-size:14px;}
#service .tit{font-size:20px; margin:0 0 10px; font-weight:bold; line-height:1.5;}

#service table{width:100%; border:1px solid #5c5c5c; margin:0;}
#service table td{width:50%; padding:0; border:none; margin:0;}
#service table td:nth-of-type(1){border-right:1px solid #5c5c5c}
#service table table{border:none;}
#service table table tr:last-of-type th, #service table table tr:last-of-type td{border-bottom:none;}
#service table table td, #service table table th{font-size:16px;}
#service table table td{width:auto; border-bottom:1px solid #5c5c5c; border-right:none !important; padding:10px 20px;}
#service table table th{font-weight:bold; background:#f6f4ee; border-right:1px solid #5c5c5c; border-bottom:1px solid #5c5c5c; text-align:left; padding:10px 0 10px 20px;}
#service table table.tbl1 th{width:140px;}
#service table table.tbl2 th{width:125px;}
#service .tbl1 th{height:75px;}
#service .tbl1 tr:nth-of-type(4) th{height:137px;}
#service .tbl1 tr:nth-of-type(5) th{height:107px;}

#service .tbl2 tr:nth-of-type(1) th{height:210px;}
#service .tbl2 tr:nth-of-type(2) th{height:184px;}

/* Media Screen */
@media screen and (max-width: 1200px) {
#mainVisual .cap{left:auto; right:5px;}

#effect .tit{margin:0 0 5px;}

#service table td:nth-of-type(1){border-right:none;}
#service table td{width:100%; display:block;}
#service table table.tbl2 th{width:140px;}
#service table table td{display:table-cell; border-right:none;}

#service .tbl1 tr:last-of-type th, #service .tbl1 tr:last-of-type td{border-bottom:1px solid #5c5c5c;}
#service .tbl1 tr th, #service .tbl2 tr th{height:auto !important;}
}

@media screen and (max-width: 768px) {
#mainVisual .txt{font-size:14px;}

#effect h3{margin:-3% 0 0 0;}
#effect .tit, #effect .tit span{font-size:30px;}
#effect .imgBox figcaption{font-size:25px;}
#effect .imgBox figcaption::first-letter{font-size:40px;}
#effect .imgBox .img:nth-of-type(1)::after{width:20px; height:35px; margin:-18px 0 0 0; background-size:100% auto;}

#service h3{font-size:30px; padding:20px;}
#service h4{font-size:16px;}
#service h4 span{font-size:20px;}
#service .box01 p.txt{font-size:16px;}
#service h5{font-size:24px;}
#service h6, #service h6 span{font-size:20px;}
#service h6 .num{font-size:28px;}
#service .boxL{width:100%; float:none; margin:0 0 20px;}
#service .boxR{width:100%; float:none; text-align:center;}
#service .box p{font-size:14px;}
#service .box04 p{font-size:12px;}
#service .tit{font-size:16px;}
}

@media screen and (max-width: 480px) {
#mainVisual .txt{font-size:2.7vw;}

#effect{padding:0 0 30px;}
#effect .tit, #effect .tit span{font-size:5vw;}
#effect .txt, #effect .txt span{font-size:3.2vw;}
#effect .imgBox .img{width:100%; float:none !important;}
#effect .imgBox .img:nth-of-type(1){margin:0 0 80px;}
#effect .imgBox .img:nth-of-type(1):after{left:50%; right:auto; top:auto; bottom:-60px; margin:0 0 0 -18px;
transform:rotate(90deg); -webkit-transform:rotate(90deg);}

#service{padding:30px 0 60px;}
#service h3{font-size:6vw; padding:15px;}
#service h4{padding:10px 0; font-size:14px;}
#service h4 span{font-size:16px;}
#service h4 br{display:block;}
#service h5{font-size:18px;}
#service h6, #service h6 span{font-size:16px;}
#service h6 .num{font-size:20px;}
#service .inner{padding:15px;}
#service .txtLabel{display:block; border-radius:10px; -webkit-border-radius:10px; -moz-border-radius:10px;}
#service table table td, #service table table th{font-size:14px;}
#service table, #service tbody, #service tr, #service th, #service td{width:100% !important; display:block !important; border:none !important;}
#service table table td, #service table table th{border:1px solid #5c5c5c !important; margin:0 !important; padding:10px !important;}
#service table table td{border-top:none !important; border-bottom:none !important;}
#service .tbl2 tr:last-of-type td{border-bottom:1px solid #5c5c5c !important;}
}