@charset "UTF-8";

/*
Theme Name:  ZEAL
Theme URI: http://zeaplus.co.jp/
Description: ZEAL
Version: 1.1
Author: ZEALPLUS
Author URI: http://zeaplus.co.jp/	
*/


/*
===== CONTENTS ================================================================================

	Index:
  - Base Style
  - Layout
  
===============================================================================================
*/


/* 1: Base Style Setting
----------------------------------------------------------------------------------------------*/

/* Base Setting
==========================================================*/

body { font: 14px/2 "メイリオ", meiryo, Arial, sans-serif;
	    margin:0; padding: 0; background: #fff; letter-spacing: 0.08em; -webkit-text-size-adjust: 100%; color: #000; }
	  
a { text-decoration: none; color: #000; }
a { outline:none;}
img { -ms-interpolation-mode: bicubic; vertical-align: bottom; } 
:focus { outline: 0; }
p { line-height: 1.5em;}

.noto { font-family: 'Noto Sans Japanese', serif; }



/* main-layout
==========================================================*/

html, body, .contents, .wide { width:100%; margin: auto;} 

.inner { width: 1000px; margin: 0 auto;}

.bg-g { background: #F4F4F4;}
h1{ margin:-999px 0 0 -999px; width: 999px; height: 999px; }
a[href^="tel:"] { cursor: default; }

.tume { letter-spacing: 0; }

/* 2: layout
----------------------------------------------------------------------------------------------*/

/* 2column commons name */


	
/* common
==========================================================*/

header {}
header p { float: left; margin-left: 20px;}
header .yellow { background: #ffff00;}
header .yellow .txt { font-family: 'Noto Sans Japanese', serif; line-height: 65px; font-size: 16px; font-weight: bold;}
header .yellow .arrow {}
header .yellow .tel { line-height: 65px;  }
header .yellow .tel img { vertical-align: middle;}
header .yellow .midashi { background: #000; color: #fff; height: 30px; line-height: 30px; padding: 0 10px; margin-top: 17px; font-weight: bold;
	-moz-transform-origin:0 100%;
	-webkit-transform-origin:0 100%;
	transform-origin:0 100%;
	-moz-transform:skewX(-20deg);
	-webkit-transform:skewX(-20deg);
	transform:skewX(-20deg); }

.ttl{ margin-bottom: 100px; }
.ttl .en {  font-size: 70px; letter-spacing: 0.1em; font-weight: bold; }
.ttl .jp {font-family: 'Noto Sans Japanese', serif; font-weight: bold;  font-size: 20px;}

.en { font-family: 'Poppins', sans-serif; font-weight: bold; }
.midashi { font-family: 'Noto Sans Japanese', serif; }

.serlist { margin: 0 0 -80px -80px; }
.serlist li.wrap { float: left; width: 460px; margin: 0 0 80px 80px; } 
.overtxt {font-family: 'Poppins', sans-serif; font-weight: bold; color: #ff0; font-style: oblique; font-size: 40px;  position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); /* Safari用 */ transform: translate(-50%, -50%); }
.overtxt.jp { font-family: 'Noto Sans Japanese', serif; font-weight: bold; }
.obj { bottom: 0; right: 0; }
.serlist li.wrap .midashi { margin: 20px 0;}
.serlist li.wrap .midashi span { font-size: 28px; font-weight: bold; background: linear-gradient(transparent 75%, #ff0 0%); }
.serlist li.wrap .camp { margin-left: -10px;  }
.serlist li.wrap .camp li{ float: left; margin-left: 10px; }
.serlist li.wrap .camp li.txt { line-height: 1.4em; font-size: 16px;}
.serlist li.wrap .camp li.txt span { text-decoration: underline;}
.pritxt { font-family: 'Oswald', sans-serif; font-weight: 700; font-size: 25px;  line-height: 1em; padding-top: 5px; } 
.serlist li.wrap .camp li.pritxt span { font-size: 35px;}
.serlist li.wrap .ill { bottom: 0; left: -360px;}

.linkbtn { box-sizing: border-box; position: relative; width: 460px; height: 280px; }
.linkbtn a { border: 1px solid #000; display: block; width: 100%; height: 100%;}
.linkbtn .linktxt { text-align: center; position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); /* Safari用 */ transform: translate(-50%, -50%); }
.linkbtn .linktxt .en { font-size: 40px;}

.camp { margin-bottom: 60px;}


.widecontact { box-sizing: border-box; height: 250px; background:url(../img/common/contactbg.png) repeat-x;}
.widecontact .clearfix { padding-top: 45px;}
.widecontact .col-l { width: 610px;}
.widecontact .midashi { background: #ff0; text-align: center; font-weight: bold; height: 50px; line-height: 50px; font-size: 22px; margin-bottom: 20px;}
.widecontact .img { }
.widecontact .col-r { width: 340px;}
.widecontact .col-r ul { margin-left: -20px; }
.widecontact .col-r li {font-family: 'Noto Sans Japanese', serif; font-size: 22px; font-style: oblique; font-weight: bold; float: left; margin-left: 20px; box-sizing: border-box; border-radius: 50%; border: 1px solid #000; background: #fff; width: 160px; height: 160px; text-align: center; line-height: 1.2em; display: flex; justify-content: center; align-items: center;   }

.areabtn { box-sizing: border-box; height: 420px; padding: 60px; border: 2px solid #d2d2d2; margin-bottom: 120px;}
.kasou .areabtn { height: 580px;} 
.areabtn a { display: block; width: 100%; height: 420px;}
.areabtn .col-l { width: 400px; }
.areabtn .col-l .midashi { font-size: 24px; font-weight: bold; border-bottom: 2px solid #000; margin-bottom: 10px; }
.areabtn .col-l .txt { margin-bottom: 40px;}
.areabtn .col-r {}
.areabtn .ttlarea { text-align: center; margin-bottom: 40px; }
.areabtn .ttlarea .en { margin: 0 auto; font-size: 50px; width: 180px; }
.areabtn .ttlarea .en:after { content: ''; display: block; width: 100%; height: 10px; background: #ff0; margin-top: -30px; margin-bottom: 20px;}
.areabtn .ttlarea .jp { font-size: 20px;}

footer { padding: 80px 0;}
.footmenu { display: flex; justify-content: center; margin: 40px 0; }
.footmenu li { float: left; }
.footmenu li a { padding: 0 10px;}
.footmenu li:first-child:before { content: "|"; }
.footmenu li:after { content: "|"; }
.pagetop { right: 80px; bottom: 110px; }
footer .copy { font-size: 9px; }





/* gnav
==========================================================*/

.gnav {  }
.gnav li {  width: 150px; float: left; margin-left: 20px; }
.gnav li a {  box-sizing: border-box; height: 130px; display: block; width: 150px;  padding-top: 30px;}
.gnav .en { width: 150px; text-align: center; font-family: 'Poppins', sans-serif; font-size: 20px; font-style: oblique; padding-bottom: 8px; margin-bottom: 10px; border-bottom: 2px solid #000; letter-spacing: 0.1em;}
.gnav .jp { font-family: 'Noto Sans Japanese', serif; font-weight: 500; width: 150px; text-align: center; }
.gnav li a:hover .en { color: #ff0;} 


/* index
==========================================================*/

.slider-pro { margin: -20px 0 110px !important;}
.index {}
.index .ttl { position: relative; z-index: 9999; }
.index .ttl .en:after  { content: ""; display: block; border-bottom: 1px dotted #000; margin-top: -55px; margin-bottom: 45px; }
.index .section { margin-bottom: 150px;}
.index .section01 { margin-bottom: 80px;}
.index .section01 .ttl { width: 460px;  }
.index .section01 .ttl .en:after  { border: none;}
.index .section01 .wrap-l { margin-top: -210px;}
.index .section02 .reason { margin-left: -80px; }
.index .section02 .reason li { width: 460px; float: left; margin: 0 0 80px 80px;}
.index .section02 .reason li .col-l { width: 120px;} 
.index .section02 .reason li .col-r { width: 300px;} 
.index .section02 .reason li .col-r .midashi { font-size: 28px; border-bottom: 2px solid #000; font-weight: bold; letter-spacing: 0.1em; margin-bottom: 20px;}
.index .section03 {}
.index .section03 .flow { margin-bottom: 30px; margin-left: -20px; }
.index .section03 .flow li { float: left; height: 100px; background: url(../img/common/flow-arrow.png) no-repeat right center; margin-left: 20px; }
.index .section03 .flow li:last-child { background: none;}
.index .section03 .flow li p { position: relative; top: 50%; -webkit-transform: translateY(-50%); /* Safari用 */ transform: translateY(-50%);}
.index .section03 .flow li .no { float: left; font-size: 26px; font-family: 'Poppins', sans-serif; font-weight: bold; font-style: oblique; background: #ff0; width: 45px; height: 45px; border-radius: 50%; line-height: 45px; text-align: center;  }
.index .section03 .flow li .txt { font-size: 18px; font-weight: bold; padding:0 40px 0 70px;}




	
/* kasou
==========================================================*/

.kasou { }
.kasou .pagettl { width: 420px; margin: 80px auto; text-align: center; position: relative; z-index: 9999; }
.kasou .pagettl .en { font-size: 80px; width: 420px; font-family: 'Poppins', sans-serif; font-weight: bold; }
.kasou .pagettl .en:after { content: ''; display: block; width: 420px; height: 20px; background: #ff0; margin: -50px auto 20px;}
.kasou .pagettl .jp { font-weight: bold; font-size: 20px; font-family: 'Noto Sans Japanese', serif; }
.kasou .catch { position: relative; z-index: 9999; box-sizing: border-box; width: 100%; height: 70px; font-family: 'Noto Sans Japanese', serif; border: 1px solid  #000; border-left: none; border-right: none; }
.kasou .catch p { font-weight: 700; line-height: 68px; text-align: center; font-size: 30px; font-style: oblique; }

.kasou .section { padding: 80px 0 120px; }


/* servise
==========================================================*/



/* price
==========================================================*/

.price { }

.price .serlist li.wrap { margin-bottom: 0;} 
.price .serlist .overtxt { width: 100%; height: 100%; text-align: center; font-size: 30px; background: rgba(0,0,0,0.2); }
.price .serlist .overtxt p { position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); /* Safari用 */ transform: translate(-50%, -50%); width: 100%;}
.price .serlist .overtxt:hover { background: none;}
.price .serlist li.wrap .camp { box-sizing: border-box; height: 80px; padding: 20px 10px; margin-left: 0; background: #ff0;  }
.price .serlist li.wrap .camp li { margin-left: 20px;}
.price .serlist li.wrap .camp li.txt { }
.price .serlist li.wrap .camp li.txt span { font-weight: bold; }
.price .linkbtn { height: 360px; }



/* flow
==========================================================*/

.flow { }
.flow .flolist { position: relative; z-index: 9999; margin-left: -120px; margin-bottom: -90px; }
.flow .flolist li.wrap { float: left; width: 440px; margin-bottom: 90px; margin-left: 120px; }
.flow .flolist li.wrap div.img { width: 120px; margin: 0 auto 40px; }
.flow .flolist li.wrap .midwrap { width: 100%; padding-bottom: 10px; margin-bottom: 20px; border-bottom: 1px solid #000;}
.flow .flolist li.wrap .midwrap .midashi { text-align: center; font-size: 28px; font-weight: bold; }
.flow .flolist li.wrap .midwrap .muryo { margin-top: 10px; float: right; width: 55px; height: 30px; background: #ff0; text-align: center; line-height: 30px; font-weight: bold;}
.flow .flolist li.wrap p { text-align: center; margin-bottom: 20px; }

.flow .flolist li.wrap01,
.flow .flolist li.wrap02 { height: 340px; }
.flow .flolist li.wrap03,
.flow .flolist li.wrap04 { height: 300px; }
.flow .flolist li.wrap05,
.flow .flolist li.wrap06 { height: 320px; }


/* faq
==========================================================*/

.faq { }

.faqlist { position: relative; z-index: 9999; width: 850px; margin: 0 auto; }
.faqlist .maru { float: left; width: 60px; height: 60px; box-sizing: border-box; border: 1px solid #000; background: #ff0; border-radius: 50%; line-height: 60px; text-align: center; font-family: 'Poppins', sans-serif; font-size: 30px; }
.faqlist p { padding-left: 90px; }
.faqlist dt { margin-bottom: 20px;}
.faqlist dt p { line-height: 60px; font-size: 20px; }
.faqlist dd { border-bottom: 1px solid #000; margin-bottom: 60px; padding-bottom: 60px;}
.faqlist dd:last-child { padding: 0; margin: 0; border: none;}
.faqlist dd p { line-height: 2em; }
.faqlist dd .maru { background: #fff; }





/* company
==========================================================*/

.company { }
.company .comtb { position: relative; z-index: 9999; }
.company .comtb td { box-sizing: border-box; padding: 30px; border: 1px solid #000; }
.company .comtb td.midashi { width: 20%; font-weight: bold; }




/* privacy
==========================================================*/

.privacy { }
.privacy .pridl { position: relative; z-index: 9999; width: 850px; margin: 0 auto; }
.privacy .pridl dt { font-size: 20px; margin-bottom: 20px;}
.privacy .pridl dd { padding-bottom: 40px; border-bottom: 1px dotted #000; margin-bottom: 40px;}
.privacy .pridl dd:last-child { padding: 0; margin: 0; border: none;}








/* area
==========================================================*/

.area { }

.area .areabtn { position: relative; z-index: 9999; border: none; height: auto; margin-bottom: 0; }
.area .areabtn a { display: inline; text-decoration: underline;}
.area .areabtn a:hover { text-decoration: none;}

.area .tihou { width: 850px; margin:0 auto 60px; }
.area .tihou .midashi { font-size: 20px; font-style: oblique; font-weight: bold; text-align: center; height: 40px; line-height: 40px; width: 100%; background: #ff0; margin-bottom: 40px;  }
.area .tihou dl { }
.area .tihou dt { font-size: 20px; font-family: 'Noto Sans Japanese', serif; }
.area .tihou dt .line { height: 2px; background: #ccc; position: relative; margin: 10px 0 20px;  }
.area .tihou dt .line p { height: 2px; width: 100px; background: #000; position: absolute; top: 0; left: 0;  }
.area .tihou dd { margin-bottom: 40px; }
.area .tihou dd a { text-decoration: underline;  }
.area .tihou dd a:hover { text-decoration: none; }

.area.detail { }
.area.detail .subcatch { font-size: 30px; font-weight: bold;font-family: 'Noto Sans Japanese', serif; margin-bottom: 80px;}
.area.detail .serlist { margin-bottom: 60px;}
.area.detail .serlist .midashi { font-weight: bold; text-decoration: underline; font-size: 16px; }
.area.detail .bbox { box-sizing: border-box; width: 100%; border: 1px solid #000; margin-bottom: 40px; padding: 50px 75px; }
.area.detail .bbox .midashi { font-size: 20px; font-style: oblique; font-weight: bold; text-align: center; height: 40px; line-height: 40px; width: 100%; background: #ff0; margin-bottom: 40px; }
.area.detail .bbox li { margin-bottom: 10px; }

.area.detail .plicetb { width: 100%; }
.area.detail tr { }
.area.detail td { padding: 10px 0 5px; border-bottom: 1px dotted #000; }
.area.detail td.name { width: 28%; }
.area.detail td.plice { width: 18%;}
.area.detail td.arrow { width: 6%;}
.area.detail td.red { width: 17%; color: red; }
.area.detail tr:last-child td { border-bottom: none;  }

ul.listtype {}
ul.listtype li { float: left; margin-right:-1em; }
ul.listtype li:before { content:"・"; margin-left: 1em; }
ul.listtype li:first-child:before { content: none; margin-left: 0; }





* html .sampleset{}/*IE6 Hack*/
*:first-child+html .sampleset{}/*IE7 Hack*/
head~/* */body .sampleset{}/*IE8 Hack*/
	
	









