@charset "utf-8";
@import url('https://fonts.googleapis.com/css?family=Cinzel|Cormorant+Garamond');
@import url('https://fonts.googleapis.com/css?family=Cairo');

/**********************************************************************　フラッシュライク　*************************************************************************/

#flash02,#flash03,#flash04,#flash05{ opacity: 0.3 }
#flash01 { opacity: 0 ; margin: 30px 0 -30px 0 ; width: 100% }
#flash05 { opacity: 0 ; margin: 30px 0 -30px 0 ; width: 100% }

article div#tween01,
article div#tween02,
article div#tween03,
article div#tween04
{ padding: 0 0 0 0; } 

/**********************************************************************　タイポグラフィー　*************************************************************************/

body { font-family: "Noto Sans Japanese"; }
.Tpgrh  {  }
.eng { font-family: 'Cinzel', serif; text-transform: uppercase;letter-spacing: 0.1em;}

/***********************************************************************　リンク　色　******************************************************************************/

a { text-decoration: none;color: #000000;}
article a , footer a { transition-property: all;transition: 0.5s linear; }
article a  { color: hsla(158,27%,47%,1.0);font-weight: bolder }
/*
.bg { background-color: #ff0}

/**********************************************************************　文字色　*******************************************************************************/

body { color: #222222 }

/**********************************************************************　アローリスト　*******************************************************************************/

ul.arrowlist li:before { background-color: hsla(158,27%,47%,1.0) }
ul.arrowlist li:after { border-left-color:#fff; }

/**********************************************************************　ボーダー色　角丸　*******************************************************************************/

.card a { border: 1px solid hsla(158,35%,55%,0.7);border-radius:8px;color: #000 ; font-weight: normal ; }  
.card span.cardh { border-bottom: 1px dotted #ccc; }
.card a:hover { background-color: hsla(158,35%,55%,0.2) }
.card.active a { background-color: hsla(158,35%,55%,0.2) }

#link  .card.card02 span.cardt { text-align: justify ; text-justify: inter-ideograph; }

.tray { border: 1px dotted #bbb;border-radius:8px; }

.boto { border-top: 1px dotted #bbb; }

.kakomi { border: 1px solid #cccccc;padding: 15px 20px ; margin-bottom: 20px }
.kakomi.lis { padding-bottom: 5px;  }

.kakomi.topics  { max-height: 200px ; overflow-y: scroll }
.kakomi.topics400  { max-height: 400px ; overflow-y: scroll }
.kakomi.topics600  { max-height: 600px ; overflow-y: scroll }
.kakomi.topics800  { max-height: 800px ; overflow-y: scroll }
.kakomi.topics1000  { max-height: 1000px ; overflow-y: scroll }

/**********************************************************************　テーブル　*******************************************************************************/

table { width: 100%; }
th { font-weight: normal; }

table.cp { border-top: 1px solid hsla(158,20%,80%,1) ; border-left: 1px solid hsla(158,20%,80%,1); }
table.cp th,table.cp td { border-right: 1px solid hsla(158,20%,80%,1) ; border-bottom: 1px solid hsla(158,20%,80%,1); font-size: 0.9em ;line-height: 1.2em; padding: 10px}

table.cp	td	{ text-align: left;width: 70% }
table.cp	th	{ text-align: center;width: 30% }

table.price { border-top: 1px solid hsla(158,20%,80%,1) ; border-left: 1px solid hsla(158,20%,80%,1); margin: 10px 0 ; }
table.price th,table.price td { border-right: 1px solid hsla(158,20%,80%,1) ; border-bottom: 1px solid hsla(158,20%,80%,1); font-size: 0.9em ;line-height: 1.2em; padding: 10px}

table.price	td	{ text-align: center;width: 40% }
table.price	th	{ text-align: center;width: 20% }

table.price.ma	td	{ text-align: center;width: 40% }
table.price.ma	th	{ text-align: center;width: 60% }



/**********************************************************************　冨田　*************************************************************************/

.markfhead {  }

#speach h1.markfhead { background-image: url(../img/speach.png) ; background-size: auto 50px;background-position: 0 0 ; padding: 10px 0 30px 60px }
#building h1.markfhead { background-image: url(../img/building.png) ; background-size: auto 42px;background-position: 0 4px ; padding: 10px 0 30px 60px }
#board h1.markfhead { background-image: url(../img/board.png) ; background-size: auto 46px;background-position: 0 4px ; padding: 12px 0 30px 60px }
#time h1.markfhead { background-image: url(../img/time.png) ; background-size: auto 48px;background-position: 0 4px ; padding: 12px 0 30px 60px }
#globe h1.markfhead { background-image: url(../img/globe.png) ; background-size: auto 48px;background-position: 0 4px ; padding: 12px 0 30px 60px }
#hands h1.markfhead { background-image: url(../img/hands.png) ; background-size: auto 48px;background-position: 0 4px ; padding: 12px 0 30px 60px }
#link h1.markfhead { background-image: url(../img/link.png) ; background-size: auto 48px;background-position: 0 4px ; padding: 12px 0 30px 60px }
#info h1.markfhead { background-image: url(../img/info.png) ; background-size: auto 48px;background-position: 0 4px ; padding: 12px 0 30px 60px }
#link h1.markfhead { background-image: url(../img/link.png) ; background-size: auto 48px;background-position: 0 4px ; padding: 12px 0 30px 60px }
#mail h1.markfhead { background-image: url(../img/mail.png) ; background-size: auto 48px;background-position: 0 4px ; padding: 12px 0 30px 60px }
#marketing h1.markfhead { background-image: url(../img/marketing.png) ; background-size: auto 48px;background-position: 0 4px ; padding: 12px 0 30px 60px }
#opticianry h1.markfhead { background-image: url(../img/opticianry.png) ; background-size: auto 48px;background-position: 0 4px ; padding: 12px 0 30px 60px }
#presen h1.markfhead { background-image: url(../img/presen.png) ; background-size: auto 48px;background-position: 0 4px ; padding: 12px 0 30px 60px }
#task h1.markfhead { background-image: url(../img/task.png) ; background-size: auto 48px;background-position: 0 4px ; padding: 12px 0 30px 60px }
#hint h1.markfhead { background-image: url(../img/hint.png) ; background-size: auto 48px;background-position: 0 4px ; padding: 12px 0 30px 60px }
#business h1.markfhead { background-image: url(../img/business.png) ; background-size: auto 48px;background-position: 0 4px ; padding: 12px 0 30px 60px }
#presen h2.markfhead { background-image: url(../img/presen.png) ; background-size: auto 48px;background-position: 0 4px ; padding: 12px 0 30px 60px }

#speach h2.markfhead,#speach h3.markfhead { background-image: url(../img/speach.png) ; background-size: auto 32px;background-position: 0 0 ; padding: 3px 0 30px 34px }
#building h2.markfhead,#building h3.markfhead { background-image: url(../img/building.png) ; background-size: auto 24px;background-position: 0 4px ; padding: 3px 0 30px 34px }
#business h2.markfhead,#business h3.markfhead { background-image: url(../img/business.png) ; background-size: auto 24px;background-position: 0 4px ; padding: 3px 0 30px 34px }
#board h2.markfhead,#board h3.markfhead { background-image: url(../img/board.png) ; background-size: auto 28px;background-position: 0 4px ; padding: 4px 0 30px 34px }
#time h2.markfhead,#time h3.markfhead { background-image: url(../img/time.png) ; background-size: auto 28px;background-position: 0 4px ; padding: 6px 0 30px 34px }
#globe h3.markfhead { background-image: url(../img/globe.png) ; background-size: auto 28px;background-position: 0 4px ; padding: 6px 0 30px 34px }
#hands h3.markfhead { background-image: url(../img/hands.png) ; background-size: auto 28px;background-position: 0 4px ; padding: 6px 0 30px 34px }
#link h3.markfhead { background-image: url(../img/link.png) ; background-size: auto 28px;background-position: 0 4px ; padding: 6px 0 30px 34px }
#opticianry h3.markfhead { background-image: url(../img/opticianry.png) ; background-size: auto 28px;background-position: 0 4px ; padding: 6px 0 30px 34px }
#marketing h3.markfhead { background-image: url(../img/marketing.png) ; background-size: auto 28px;background-position: 0 4px ; padding: 6px 0 30px 34px }
#presen h3.markfhead { background-image: url(../img/presen.png) ; background-size: auto 28px;background-position: 0 4px ; padding: 6px 0 30px 34px }
#task h3.markfhead { background-image: url(../img/task.png) ; background-size: auto 28px;background-position: 0 4px ; padding: 6px 0 30px 34px }
#trade h3.markfhead { background-image: url(../img/trade.png) ; background-size: auto 28px;background-position: 0 4px ; padding: 6px 0 30px 34px }

#price h3.markfhead { background-image: url(../img/price.png) ; background-size: auto 28px;background-position: 0 6px ; padding: 6px 0 30px 34px }

body.outline #business h2.markfhead { background-image: url(../img/business.png) ; background-size: auto 48px;background-position: 0 4px ; padding: 12px 0 30px 60px }
#pp h2.markfhead { background-image: url(../img/pp.png) ; background-size: auto 48px;background-position: 0 4px ; padding: 12px 0 30px 60px }

body.en h1.markfhead { padding-bottom: 10px !important ; }
body.en#en06 h1.markfhead { padding-bottom: 15px !important ; }
body.en#en08 h1.markfhead { padding-bottom: 15px !important ; }



/*
article.h1box .hometomita ,
article.h1box .tomita { color: hsla(158,40%,45%,1.0) }
*/

h1.markfhead, h2.markfhead, h3.markfhead, h4.markfhead { background-repeat: no-repeat ;text-align: left }

article { background-color: hsla(158,100%,100%,1.0) ;position: relative ;font-size: 0.9em ; line-height: 1.8em } 
article.h1box { background-color: hsla(158,100%,100%,0.5) }

article#message div p { margin-bottom: 15px }
article#message {  }

#thumb-box {  }


.sitemap { background-color: hsla(158,35%,55%,0.3) ; font-size: 0.8em }
.sitemap { color: #fff }
.sitemap div { display: table ; margin: 0 auto }
.sitemap a { background-color: hsla(158,35%,55%,0.6) ; border-right: 1px solid hsla(158,35%,100%,0.5) ; display: block ; float: left ; color: #fff ; padding: 10px 30px }

.sitemap a:hover { background-color: hsla(158,35%,55%,1.0) }

/**********************************************************************　数字付　*******************************************************************************/

ol  {
position: relative;
margin:0;
padding:0
}
ol li  {
list-style: none;
list-style-position:outside;
margin:0;
padding-left:1.5em
}
ol li span.numu
{
position: absolute;
left:0;
margin:0;
}

ul li span , ol li span
{
font-size: 1.2em;
font-family: "Noto Sans Japanese";
color: hsla(158,27%,47%,1.0);
font-weight: bolder;
}

/*IE6*/
*html ol li span  {
left: -1.2em;
}
*html ul li span  {
left: -1.2em;
}