@charset "utf-8";
@import url(swiper.css);@import url(drawerMenu.css);@import url(en.css);@import url(enfonts.css);
@import url('https://fonts.googleapis.com/css?family=Oxygen:400');
@import url('https://fonts.googleapis.com/css?family=Titillium+Web');
@import url(https://use.fontawesome.com/releases/v5.0.6/css/all.css);

/**********************************************************************　テスト　*******************************************************************************/

section { text-align: justify ; text-justify: inter-ideograph ; /*background-color: #ff0;*/ }

/**********************************************************************　基本　*******************************************************************************/

html { font-size: 62.5%; }
html,body { height: 100%; margin: 0;padding: 0 }
body { text-align: center ; background-color: #fff ;font-size: 1.4rem;-webkit-font-smoothing: antialiased; } 
body.org div#container { position:relative }

a { color: #000; text-decoration: none;  }

a:hover,
a i,
#sitemap a i,
a.iro { color: rgba(87,135,212,1.00) }
#sitemap .flow-box a { margin: 0 15px 0 0 }

.linkib p { text-align: left!important: }
.linkib p a { display: inline-block; text-align: left!important: }

.otoiawasebox p { margin: 0 0 .6em; padding: 0; line-height: 1em }
p.otoiawase a span { display: inline-block!important; padding-bottom: 1px; border-bottom: 1px dotted rgba(87,135,212,1.00); }
.otoiawasebox p.chiiki { line-height: 1.5em }
.otoiawasebox p.ikuma { padding-top: 10px }

#topthumb a:hover,
footer a ,
.tt a ,
.exam a
{ color: #000 ; }

img { border: none }
ul , li { margin: 0 ; padding: 0 ; }
ul li { list-style: none}
ol { margin: 0 0 0 15px ; padding: 0 ; }

section,footer,header,article,main,div,p { position:relative } 
header#togglebox { z-index: 100 } 

article { ; }
main { ; }

img, div, p, figure{ margin: 0;padding: 0 }img { border-style: none;vertical-align: bottom }


.color01 { border: solid 1px #d1d5db } /*rgba(209, 213, 219 ,.9);*/
.color02 { border: solid 1px #8291aa } /*rgba(130, 145, 170,.9);*/
.color03 { border: solid 1px #dae4f5 } /*rgba(218, 228, 245,.9);*/
.bg1 { background-color: #f1f1f1 }
.color05 { color: #558bb3 }
.color06 { color: #9eb0ce }
nav ul li a span.ensub { display: block ; font-size: 0.7em ; text-transform: uppercase ; letter-spacing: 0.05em }
.ensub { font-family: 'Titillium Web', sans-serif; }

.rela { position: relative }
.fxt { position: fixed }
.abso { position: absolute ; z-index: 1 }
.clear-box { clear: both;float: none;margin: 0;padding: 0; }

.clearfix:after { content: '';display: block;clear: both; }
.clearfix { zoom: 1; /* for IE6/7 */ }

.wrap:after { content: '';display: block;clear: both; }
.wrap { zoom: 1; /* for IE6/7 */ }


hr {
  height: 10px;
  border: 0;
  box-shadow: 0 10px 10px -10px #bbb inset;
  margin: 30px 0;
}

input , textarea { border: solid 1px #ccc }

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

.ensub {  }

.txl { text-align: left }
.txj { text-align: justify }
.txc { text-align: center }
.txr { text-align: right }
h1, h2, h3, h4 { font-weight: normal}

.abso.txr { right: 5px ; bottom: -5px }
.danra { padding: 15px 0 0 0 }
.arrow-down { padding: 15px 0 10px 0 ; font-size: 2.0em ; color: #999 }
.ltx { font-size: 1.2em ; line-height: 1.2em }

/**********************************************************************　フォントサイズ　*************************************************************************/

-section { font-size: 0.8em ; line-height: 1.6em ; font-weight: 200 }
h1 { font-size: 1.5em;line-height: 1.5em ; padding: 0 0 10px ; margin: 0 }
#index-box h1 { font-size: 1.6em;line-height: 1.0em ; padding: 2px 0 8px ; margin: 0 }
h2 { font-size: 1.2em;line-height: 1.6em }
h3 { font-size: 1.1em;line-height: 1.3em ; padding: 0 0 10px ; margin: 0 }

.h1-like { font-size: 1.2em ; line-height: 1.6em ; padding: 0 0 20px 0 }

body.detail h1 { font-size: 1.5em;line-height: 1.5em ; text-align: center ; margin: 0 ; padding: 0 }
body.detail h2 { font-size: 1.2em;line-height: 1.2em ; text-align: center ; padding: 10px 0 20px 0 ; margin: 0 0 20px 0 }
body#contact h2 { padding: 0 ; margin: 0 }

.sanichi h3 { font-size: 1.3em;line-height: 1.6em ; padding: 30px 0 20px ; margin: 0 ; text-align: center }
.palette h4 { font-size: 1.0em;line-height: 1.0em ; border: 1px solid #ccc ; margin: 0 0 10px ; padding: 0.8em 0 0 1em ; height: 1.5em }
#remune .flow-box h3 {  }

/**********************************************************************　デザイン　*******************************************************************************/

.photo-box img { width: 33.333333333333% ; height: auto }

.z1 {z-index:1}.z2 {z-index:2}.z3 {z-index:3}.z10 {z-index:10}.z100 {z-index:100}
.pt { padding-top: 20px }.pb { padding-bottom: 20px }
.mt { margin-top: 20px !important}.mb { margin-bottom: 20px !important}.mb10 { margin-bottom: 10px !important}

.kakomi { border: solid 1px #ccc ; padding: 10px 0 ; margin: 0 0 20px ; text-align: center }
.bobo { border-bottom: dotted 1px #aaa ; padding-bottom: 20px; margin-bottom: 20px }
.boboso { border-bottom: solid 1px #aaa ; padding-bottom: 20px; margin-bottom: 20px }
.boto { border-top: dotted 1px #aaa ; padding: 10px 0; }
.swiper-slide .abso { left: 0 ; bottom: 0 ; width: 100% }

.exam a { display: block ; border: 1px solid #ddd }
.exam a:hover , .exam.hit a { background-color: #E4E7EC }  /*   border: 1px solid hsla(0,47%,49%,.5) */
.exam img { width: 20% ; height: auto ; }
.exam .abso { left: calc( 22% + .5em ) ; top: calc( 50% - 0.4em ) ; }
.exam.nigyo .abso { top: calc( 50% - 1.3em ) ; }

.detail-box { width: 100% ; font-size: 1.0em ; line-height: 1.9em }
.detail-box img { width: 100% ; height: auto }
.about-box { border-top: solid 1px #ccc ; padding: 30px 20px 20px; margin-top: 0 }
#overview .about-box { margin-top: 0 }
.about-box h2 { text-align: center ; font-size: 1.4em ; line-height: 1.4em }

.detail-pad { padding-top: 30px }
.btbox { display: block ; padding: 5px 0 ;text-align: center ; border: #ccc 1px solid ; margin: 5px 0 0 0 ; clear: both }
a:hover .btbox { background-color: #E4E7EC ; transition-property: all;transition: 0.3s linear; }
.btbox i { padding-right: 5px }

#topthumb a { display: block  }

/***********************************************************************　フッター　******************************************************************************/

footer{
display: block;
clear: both;
float: none;
}

.footer-box {  }
.sns { position: absolute }
.insta img,
.facebook img { width: 36px ; height: auto ; vertical-align: middle ; padding: 0 15px 0 5px }

footer a.hit { color: #555 }

footer ul {
margin: 4px ;
padding: 0px ;
}

footer ul li {
list-style: none; font-size: 1.0em ; line-height: 1.0em; padding: 0 8px 0 0 ; float: left ; 
}
footer ul li a { border: solid 1px hsla(214,9%,64%,.4); padding: 4px 8px 2px; }
footer ul li.end a { border: solid 1px hsla(214,9%,64%,1.00); ; 
}

/***********************************************************************　スワイパー　******************************************************************************/

.orgfeed,.swiper-wrapper { position: relative; }
.swiper-container { overflow: hidden ; position: relative; }
.swiper-container { background-color: #ffffff ; }
.swiper-slide { width: 100%; vertical-align: top}
.swiper-slide img { width: 100%;height: auto; padding: 0 0 30px 0;vertical-align: top }
.swiper-slide {  }  
.swiper-pagination-bullet,
.pagination-num p { width: 30px;height: 30px; }

.swiper-pagination-bullet {
  display: inline-block;
  background: #fff;
  opacity: 1;
}
.swiper-pagination-bullet:hover,
.swiper-pagination-bullet-active {
  opacity: .3;
}

.pagination-num { position: absolute ; z-index: 1; right: 0px }
.pagination-num p { font-size: 1.2em ; line-height: 1em ; text-align: center ; float: left }


.swiper-slide {
        text-align: center;
        display: -webkit-box;
        display: -ms-flexbox;
        display: -webkit-flex;
        display: flex;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        -webkit-justify-content: center;
        justify-content: center;
        -webkit-box-align: center;
        -ms-flex-align: center;
        -webkit-align-items: center;
        align-items: center;
    }
.swiper-slide {
		-webkit-box-pack: center;
        -ms-flex-pack: center;
        -webkit-justify-content: center;
        justify-content: center;
        -webkit-box-align: center;
        -ms-flex-align: center;
        -webkit-align-items: center;
        align-items: center;
}

.orgfeed p.overlay { position: absolute ; top: 0 ; left: 0}
.orgfeed p.overlay#flash02 { z-index: 2 }
.orgfeed p.overlay#flash03 { z-index: 3 }
.orgfeed p.overlay#flash04 { z-index: 4 }
.orgfeed p.overlay#flash05 { z-index: 5 }
.orgfeed img { width: 100% ; height: auto }


/**********************************************************************　リスト　*******************************************************************************/

article ul {
margin-top: 0px ;
padding-top: 0px ;
}

ul.maru {
padding-left: 1.1em ;
margin: 0 0 0 0 ;
font-size: 0.9em ;
line-height: 1.8em ;
}

.gaiyo ul.maru {
font-size: 1.0em ;
line-height: 1.8em ;
padding-top: 20px ; 
}

.gaiyo i { padding: 0 1px 0 3px }

ul.maru li {
list-style: none  ;position: relative;
}

ul.maru li::after {
  display: block;
  content: '';
  position: absolute;
  top: .40em;
  left: -1em;
  width: 5px;
  height: 5px;
  background-color: #fff;
  border: 2px solid rgba(0,0,0,0.3);
  border-radius: 100%;
}

ul.maru.excep li::after {
  top: .6em;
}

ul.maru li strong { display: inline; font-weight: 300 }

ul.act li a{
    -webkit-transition: all 0.2s ease 0s;
    -moz-transition: all 0.2s ease 0s;
    -o-transition: all 0.2s ease 0s;
    -ms-transition: all 0.2s ease 0s;
    transition: all 0.2s ease 0s;
}

ul.act li a:before{
    position: relative;
    content: "\f105";
    font-family: FontAwesome;
    margin-right: 5px;
    font-size: 110%; 
}
ul.act li a:hover:before{
    animation: arrow .5s ease-out forwards;
}

@keyframes arrow {
 0% {
    left: 0px;
    }
 50% {
    left: 5px;
    }
 100% {
    left: 0;
    }
}


.tbl {  }
.thl, .tdl { display: block ; font-size: 1.0em }
.thl {  }

/**********************************************************************  パレット  *******************************************************************************/

.h2-pad { text-align: center ; border-top: solid #ccc 1px }

.palette-box {  }
.cus-title,
.page-header,
#secondary section,
.post,
.palette
{  }

#secondary section,
.post,
.palette
{ text-align: justify ; text-justify: inter-ideograph ; vertical-align: top }

.palette.nocont { opacity: 0 }

.sub {  }
.sub strong { font-size: 1.2em;line-height: 1.5em ; font-weight: 300 }
.sanichi p { font-size: 1.0em;line-height: 1.9em }
.palette.thumb img ,
.sub img { width: 100% ; height: auto ; }
.sub.pnomi { padding: 0 ; margin: 0 }
.sub.pnomi img { padding: 0 }

.sub.half img { width: calc( 50% - 10px  ) }
.sub.half img.fst { padding-right: 20px }

.sub img { padding: 10px 0 }

/*
.thumb .sub { font-size: 0.9em }
.thumb .sub img { padding: 10px 0 5px 0 }
.thumb a { display: block }
*/
.flow-box { border: 1px #ccc solid ; border-radius: 3px }
.flow-box .palette{ vertical-align: middle }
.flow-box .palette.five{ background-color: #f1f1f1 }
.flow-box .palette.gosan{ padding: 30px }
.flow-box .palette.goyon{ padding: 30px }
#contact .flow-box .palette { padding: 24px }

/**********************************************************************  コラム  *******************************************************************************/


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

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

table#formbox td ,table#formbox th { border-top: dotted 1px #aaa ; padding: 15px 3px }
table#formbox { border-bottom: dotted 1px #aaa ; }

table#formbox {}
.attent { display: block ; padding: 10px 0 }
.redtext { color: #3DAEE0 }
/************************************************animation************************************************/

#flash01, #flash02, #flash03, #flash04, #flash05 { opacity: 0 }