@charset "utf-8";
/* CSS Document */


.f0 {  font-size: 10px;}
.f1 {  font-size: 11px;}
.f2 {  font-size: 12px;}
.f3 {  font-size: 13px;}
.f4 {  font-size: 14px;}
.f5 {  font-size: 15px;}
.f6 {  font-size: 16px;}
.f8 {  font-size: 18px;}
.f20{  font-size: 20px;}
.fb{  font-weight: bold;}
.m-c{ margin: 0 auto;}
.m-l{ margin-left: 1em;}
.m-r{ margin-right: 1em;}
.cnt{ text-align: center;}
.left{ text-align: left;}
.right{ text-align: right;}
.o-h{ overflow: hidden;}
.inb{ display: inline-block;}
.red{ color: #c00;}
.m30{margin-bottom: 30px;}
.o-h{overflow: hidden;}

#container{
  clear: both;
  width: 800px;
  margin: 0 auto;
  background-color: #fff;
  border-left: #aaa 1px solid;
  border-right: #aaa 1px solid;
  border-bottom: #aaa 1px solid;
  box-shadow: rgba(0,0,0,0.3) 0 0 8px;
  text-align: center;
  margin: auto;
}

#contents {
  clear: both;
  width: 670px;
  margin: 0 auto;
  background-color: #fff;
  align-content: center;
  margin:  auto;
}

#header {
  width: 800px;
  text-align: center;
  margin-top:0px;
}

#head_line {
  background: #19288c;
  width: 800px;
  height: 16px;
  text-align: left;
  margin: 0;
}
h1.head{
  width: 100%;
  padding-top: 2px;
  text-indent: 1em;
  font-size: 10px;
  line-height: 1.1;
  border-bottom: #fff 1px solid;
}
#head_image {
  background-image:url(../image_koutei/kouteikanri_top3.jpg);
  background-repeat: no-repeat;
  width: 800px;
  height: 100px;
  margin: 0;
}
h2.head2{
  height: 100px;
  width:800px;
  display: table-cell;
  vertical-align: middle;
  font-size: 20px;
  font-weight: bold;
  text-align: center;
  text-shadow: #fff 1px 2px 0;
}

.mainmenu{
  width: 100%;
  height:52px;
  background: #000;
  font-size: 0;
}
.mainmenu img{opacity: 1;}
.mainmenu img:hover{ opacity: 0.85;}

.cont96{
  width: 96.75%;
  margin: 0 auto;
  margin-top: 20px;
  display: block;
}
.cont80{
  width: 80%;
  margin: 0 auto;
  margin-top: 20px;
}
p.shiryo{ margin: 6px auto; padding: 0; line-height: 1.6;}
.a-cl{
  display: block;
  clear: both;
  justify-content: start;
}

#haikei_sk, #haikei_pro, #haikei_sp, #haikei_pop{ width: 380px; height: 280px; color: #333; position: relative;}
#haikei_sk{
  background-image : url(../image_koutei/top_sk.jpg);
  background-repeat: no-repeat;
  float: left;
  border: #0091ff 1px solid;
}
#haikei_pro{
  background-image : url(../image_koutei/top_pro.jpg);
  background-repeat: no-repeat;
  float: right;
  border: #F9C 1px solid;
}
#haikei_sp{
  background-image : url(../image_koutei/top_spalysis.jpg);
  background-repeat: no-repeat;
  float: left;
  border: #F93 1px solid;
}
#haikei_pop{
  background-image : url(../image_koutei/top_pop.jpg);
  background-repeat: no-repeat;
  float: right;
  border: #3CC 1px solid;
}
#haikei-lady {
  background-image:url(../image_koutei/haikei_lady.jpg);
  background-repeat: no-repeat;
  width: 800px;
  height: 250px;
  margin: 0px;
  font-size: 12px;
}


#haikei_pre{
  background-image: url(../image_koutei/haikei_prevision_h98.jpg);
  background-repeat: no-repeat;
  width:774px;
  height: 99px;
  border: 1px solid #aaa;
  box-sizing: border-box;
  position: relative;
  margin: 20px auto 0;
}
.pre_c-back{
  height: 100%;
  background-color: transparent;
  background-image: url(../image_pre/prevision_logo_w500.png);
  background-repeat: no-repeat;
  background-position: center;
  background-size: 50%;
  top: 40%;
  left: 50%;
  transform: translateY(-50%) translateX(-50%);
  width: 50%;
  position: absolute;
}
.pre_c-name{
  line-height: 2;
  padding-top: 1em;
  text-align: center;
}
.kanren_link{
  display: flex;
  position: absolute;
  bottom: 0;
  width: 100%;
  padding: 1px 0;
  flex-direction: row wrap;
  justify-content: space-evenly;
}
.kanren_link div{
  display: inline-block;
  padding: 6px;
  font-size: 12px;
  font-weight: 700;
  color: #555;
  text-align: center;
  line-height: 1;
  border-radius: 4px;
  background: linear-gradient(165deg, white 20%, transparent);
}

.syousai{ position: absolute; bottom: 30px; right: 0; padding-right: 6px;}
.pre_syousai{ position: absolute; bottom: 10px; right:1em;}
.lady_L{
  margin-top: 70px;
  float: left;
  width:200px;
}
.lady_R{
  margin-top: 20px;
  float: right;
  width:600px;
  text-align: left;
}

.bo_bl{border: solid 1px #0091ff;}
.bo_pi{border: solid 1px #F9C;}
.bo_or{border: solid 1px #f93;}
.bo_gr{border: solid 1px #3cc;}
.bo_gry{border: solid 1px #aaa}

.link-cont{width:80%; margin: 30px auto; box-sizing: border-box; font-size: 0;
border-bottom:3px double #19288c;}

.linkbox{
  position: relative;
  overflow: hidden;
  max-width: 382px;
  margin: 0 auto 24px;
}
.linkbox img{ width: 99%; height:auto; max-width: 380px;}
.linkbtn{position: absolute; right:1%; bottom: 4%; font-size: 12px;}

.linkbox2{ height: 26px; text-align: right; box-sizing: border-box; position: relative; max-width: 382px; margin: 0 auto 24px;}
.linkbtn2{ position: absolute; right:1%; bottom:0; font-size: 12px;}

.link-label{ font-size: 16px; font-weight: bold; color: #19288c; margin-bottom: 6px; text-align: left; text-indent: .2em;}
.link-label:before{ content:"\0bb";}


/*：：：○○とは：：：*/
.tohasec{color: #333; font-size: 14px; }
.toha{text-align: left; line-height: 1.8; padding: 6px 2px; margin-bottom: 1em;}
.label-kon{
  width: 100%;
  font-size: 18px;
  font-weight: bold;
  color: #333;
  border-top: 3px double #00c;
  border-bottom: 3px double #00c;
  text-align: center;
  padding:5px 0;
}
.gyousyu-label{
  font-size: 16px;
  font-weight: bold;
  border-bottom: #ccc 1px solid;
  border-top: #ccc 1px solid;
  line-height: 1.4;
  width:100%;
}
.gyousyu-list{
  text-align: left;
  padding: 6px 10px;
  box-sizing: border-box;
  line-height: 1.8;
  margin-bottom: 20px;
}
dl.gyousyu{margin-bottom: 20px; text-align: left;}
.gyousyu dd{
  padding: 6px 10px;
  box-sizing: border-box;
  line-height: 1.8;
  margin: 0;
}
.gyousyu dt{font-size: 14px; font-weight: bold;}
/*：：：//○○とは：：：*/

/*::: footer :::*/
footer.ko{
  width: 100%;
  background: #e4e4e4;
  box-sizing: border-box;
}
.f-con, .f-con-nb{display: inline-block; padding: 0 20px; color: #00f; font-size: 12px; margin: 4px auto;}
.f-con{ border-right: 1px solid #333;}
/* 下部文字 */
.foot_bottom{
  overflow: hidden;
  width: 800px;
  margin: 0 auto;
  padding: 20px;
  font-size: 10px;
  color: #999;
  text-align: left;
  box-sizing: border-box;
}
/*::: /footer :::*/


.cloud_bar{
  width:100%;
  box-sizing: border-box;
  font-weight: bold;
  text-shadow: #e6ebef 1px 1px 0;
  text-align:center;
  display: block;
  padding:3px;
}





#main {
  float:right;
  width: 800px;
  background:#FFF;
  padding-right: 0px;
}
#side {
  float: left;
  width: 200px;
  margin-right: 0px;
}

/*:: company ::*/
#main_L, #main_R{
  box-sizing: border-box;
  padding-top: 10px;
}
#main_L{
  width: 166px;
  padding-left: 22px;
  float: left;
}
#main_R{
  width: 634px;
  padding-right: 24px;
  float: right;
}


/* P {
  line-height: 150%;
  text-align: center;
} */
H1 {
  font-size: 10px;
  color: #EEEEEE;
  width: 800px;
  font-weight: normal;
  margin : 0px;
  padding : 0px;
  text-align : left;
}
H2 {
  font-size: 12px;
  color: #333333;
  font-weight: normal;
  padding : 0px;
  margin : 0px;
  text-align : center;
}
H3 {
  	font-size: 9px;
  	color: #AAAAAA;
  	font-weight: normal;
        width: 800px;
  	margin : 0px;
  	padding : 0px;
  	text-align : right;
}
ADDRESS {
  font-family: Arial, Helvetica, sans-serif;
  font-size: 12px;
  font-style: normal;
  text-align:center;
  padding-top: 5px;
  clear: both;
}
P IMG {
  float: left;
  margin-right:5px;
  border: solid 1px #cccccc;
}
#path {
  text-align:right;
  margin: 0px;
}
A {
  text-decoration: none;
  font-weight: normal;
}
H1 A {
  color:#FFFFFF;
  font-weight: normal;
}
#side H2 {
  font-family:Arial, Helvetica, sans-serif;
  border-left:none;
  padding-left:10px;
  font-size:80%;
}
#side H2 A {
  color: #999999;
  font-weight:normal;
}
#side UL {
  font-size: 70%;
  margin: 0px;
  padding-left:15px;
}
FORM {
  font-size:90%;
}


#haikei-prevision {
        background-image:url(../image_koutei/haikei_prevision_h98.jpg);
        background-repeat: no-repeat;
        width: 772px;
        height: 98px;
  	font-size: 12px;
  	color: #333333;
  	border: 1px solid #AAAAAA;
  	margin: 0px;
}




.advice_cont ul li{ border-bottom: #ccc solid 1px;}

dl.advcont, .advcont dt, .advcont dd{  box-sizing: border-box;}
dl.advcont{
  width: 75%;
  margin: 0 auto 26px;
  border: solid 1px #333;
}
.advcont dt{
  background: #e8f0ff;
  text-align: center;
  font-size: 15px;
  font-weight: bold;
  padding: 5px;
  border-bottom: solid 1px #333;
  
}
.advcont dd{
  padding: 10px;
  text-align: left;
}

ol.admenu{
  counter-reset: item;
  padding-left: 20px;
	text-indent: -20px;
}
ol.admenu li{
  text-indent: 0;
  padding-left: 10px;
  border-bottom: 1px dashed #ccc;
  margin-top: 8px;
  padding-bottom: 2px;
  list-style-type: dotted-decimal!important;
  list-style-position: outside;
}
.ad-menucont{
  width:75%;
  padding-bottom: 20px; 
  margin: auto;
}
/*::: //ワンポイント :::*/


/*::: 資料請求 :::*/
table.shiryo_ko{
  width: 100%;
  text-align: left;
  border: none;
  border-collapse: separate;
  border-spacing: 2px;
}
.shiryo_ko th, .shiryo_ko td{ padding: 5px; box-sizing: border-box; height: 40px;}
.shiryo_ko th{
  background: #999;
  color: #fff;
  font-size: 13px;
  font-weight: bold;
  width: 16%;
  min-width: 66px;
}
.shiryo_ko td{
  background: #e4e4e4;
  width: 84%;
}
.shiryo_ko input[type="text"] ,.shiryo_ko textarea {
  width: 90%;
  box-sizing: border-box;
}
.shiryo_ko ul li{ color: #333; list-style: none; padding-left: 1em; margin-bottom: 2px;}
.shiryo_ko ul{ padding-left: 0;}
/*::: //資料請求 :::*/


/*::: index sp版 :::*/
.sp-container{
  clear: both;
  width: 90%;
  margin: 10px auto;
  display: flex;
  justify-content: space-evenly;
  flex-wrap: wrap;
  overflow: hidden;
}
.sp-container a{
  display: flexbox;
  width: 46%;
  height: auto;
}
.sp-container img{  width: 100%; height: auto;}
.sp-container::after{
  content:"";
  display: block;
  width:46%;
}



/*movie*/
.Mframe{
  width: 100%;
  height: 44.9vw;
  border: #aaa 1px solid;
  text-align: center;
  box-shadow: #ccc 0 0 5px;
}
/*PC*/
.syoukai-mv-l, .syoukai-mv-r{
  width: 49%;
  text-align: center;
  color: #333;
  font-size: 16px;
  font-weight: bold;
}
.syoukai-mv-l iframe, .syoukai-mv-r iframe{
  width: 376px;
  height: 211px;
  border: none;
  box-shadow:#999 0 0 3px;
}
.syoukai-mv-l{float: left;}
.syoukai-mv-r{float: right;}

.syoukai-mv-l2, .syoukai-mv-r2{
  width: 49%;
  text-align: center;
  color: #333;
  font-size: 16px;
  font-weight: bold;
}

.syoukai-mv-l2{float: left;}
.syoukai-mv-r2{float: right;}

/*ページトップへスクロール*/

#page-top {
	position: fixed;
	bottom: 20px;
	right: 2%;
	font-size: 100%;
}
#page-top a {
	background: rgba(51, 36, 182, 0.4);
	text-decoration: none;
	color: #fff;
	width: 50px;
	padding: 15px 0;
	text-align: center;
	display: block;
	border-radius: 5px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
}
#page-top a:hover {
	text-decoration: none;
	background: rgb(51, 36, 182);
}

/*ここまで*/
#sp_head{display: none;}
.m-ply{ height: 112px; width: 198px;}


.cr_mvcont{position: relative; padding-bottom: 56.25%; margin: 10px auto;}
.cr_mvbox{position: absolute; top: 0; left: 0; width: 100%; height: 100%;}

@media only screen and (max-width:767px) {
  #cloud_title{margin: 0 auto; padding-top:20px;}
  #header, .mainmenu, .foot_bottom, footer, .kanren_link, .pc-view, #b-2, #main_L, .pre_c-name {display: none;}
  #banner{ width:90%; overflow: hidden;} #banner img{width:100%; height:auto;}
  #container, #contents, #haikei-lady, #main_R{ width:100%;}
  #main_R{padding:0;}
  #container {border: none; box-shadow: none;}
  .cont96, .cont80 { width: 90%;}
  .m-ply{ width: 80%; max-width: 560px; height: 41vw; max-height: 315px;}
  #haikei_sk, #haikei_pro, #haikei_sp, #haikei_pop {
    width: 48%;
    max-width: 380px;
    padding-top: 34.5%;/*73.5%*/
    height:auto;
    clear: left;
    clear: right;
    display: block;
    background-size: 100%;
    box-sizing: border-box;
  }
  #haikei_sk, #haikei_sp {margin-bottom: 0px;}
  #haikei-lady{ background-image: none; height: auto; overflow: hidden; padding-bottom: 40px; width: 90%; margin: 0px auto;}
  #haikei_pre{ width: 90%; height:auto; padding-top: 11%; background-size: 100%;}
  .syousai{ bottom:10px;}
  .pre_syousai{bottom: 0; right: 0;}
  .pre_c-back{background-size: 70%; left:40%; top:50%; vertical-align: middle;}

  .lady_L{display: block; clear: left; width: 100%; margin-top: 20px;} 
  .lady_R{ clear: right; margin-top:20px; padding: 0; width: 100%;}

  .advice_cont, .advice_title{ width:90%;}
  .advice_cont{padding: 6px 20px 6px 6px;}

  .ad-menucont{width: 100%;}

  #sp_head{ display: block; height:80px;}
    .sp_h_line{ background: #19288c; height:20px; width:100%; line-height: 1.5;}
    .sp_h_box{
      background-image: url(../image_koutei/sphead.jpg);
      background-position: left top;
      width: 100%;
      height: 60px;
      text-align: center;
      font-size: 18px;
      font-weight: bold;
      line-height: 24px;
      text-shadow: #fff 1px 2px 0;
      box-sizing: border-box;
      padding: 6px 50px 0 50px;
    }

    dl.advcont{  width: 90%;}
    .advcont dd{margin-left: 14px;}
    .syoukai-mv-l2, .syoukai-mv-r2 {display: block;width: 100%;}
    .syoukai-mv-r2{padding-top: 20px;}
}

@media only screen and (min-width:768px) {
  .sp-view{display: none;}
	.M-container{
		width:600px;
		height: 400px;
	}
	.M-if{margin-bottom: 20px;}
}



/*:::::::::::::::: advice menu ::::::::::::::::::::::::::::::::::::::*/
.advice_cont{
	width:790px;
	margin: 20px auto;
	padding-bottom:  50px;
}
.adv_tab *, .adv_tab *:before, .adv_tab *:after {
	-webkit-box-sizing: border-box;
	        box-sizing: border-box;
}
.adv_tab {
	margin: 0 auto;
	position: relative;
}
.adv_tab input[type='radio'] {
	margin: 0;
	padding: 0;
	border: none;
	border-radius: 0;
	outline: none;
	background: none;
	-webkit-appearance: none;
	        appearance: none;
	display: none;
}
.adv_tab .adv_tabpanel {
	display: none;
}
.adv_tab > input:first-child:checked ~ .adv_tabpanels > .adv_tabpanel:first-child,
.adv_tab > input:nth-child(3):checked ~ .adv_tabpanels > .adv_tabpanel:nth-child(2),
.adv_tab > input:nth-child(5):checked ~ .adv_tabpanels > .adv_tabpanel:nth-child(3),
.adv_tab > input:nth-child(7):checked ~ .adv_tabpanels > .adv_tabpanel:nth-child(4),
.adv_tab > input:nth-child(9):checked ~ .adv_tabpanels > .adv_tabpanel:nth-child(5),
.adv_tab > input:nth-child(11):checked ~ .adv_tabpanels > .adv_tabpanel:nth-child(6),
.adv_tab > input:nth-child(13):checked ~ .adv_tabpanels > .adv_tabpanel:nth-child(7) {
	display: block;
}
.adv_tab > input:first-child:checked ~ #homeback{padding-top:500px!important;}

.adv_tab .adv_tabpanels {
	position: absolute;
	top:0;
	left: 120px;
	display: block;
	min-height: 320px;
	width: calc(100% - 120px);
}
.adv_tab > input + label {
	position: relative;
	z-index: 100;
	top: 10px;
	left: 1px;
	display: block;
	width: 120px;
	box-sizing: border-box;
	padding: 15px;
	cursor: pointer;
	border: 1px solid #cccccc;
	border-right: 0;
	border-radius: 6px 0 0 6px;
	margin-bottom: 5px;
	font-size: 14px;
	font-weight: bold;
	background: linear-gradient(180deg, #2b5eeb, #001181);
	color: #fff;
}
.adv_tab > input + label:last-of-type {
	margin-bottom: 100px;
}
.adv_tab > label:hover,
.adv_tab > input:focus + label {
	color: #eee;
	opacity: .7;
}
.adv_tab > input:checked + label {
	border-color: #cccccc;
	border-right: 1px solid #ffffff;/*背景色と同じ*/
	background: #fff;
	color: #333;
}
.adv_tab .adv_tabpanel {
	padding: 0.5em 1em;
	border-left: 1px solid #cccccc;
	min-height: 320px;
}

.advmidashi{
	width:100%;
	border-left: groove 4px #1d38e7;
	border-bottom: #333 1px solid;
	font-size: 16px;
	font-weight: bold;
	text-align: left;
	text-indent: 1em;
	padding: 4px 0 2px;
	margin-bottom: 10px;
	background: rgba(230,240,255,.9);
}
ol.admenu{
  counter-reset: item;
  padding-left: 20px;
	text-indent: -20px;
}
ol.admenu li{
  text-indent: 0;
  padding-left: 10px;
  border-bottom: 1px dashed #ccc;
  margin-top: 8px;
  padding-bottom: 2px;
  list-style-type: dotted-decimal!important;
  list-style-position: outside;
  text-align: left;
}




@media (max-width: 790px) {
	.advice_cont{ width:94%;}
	.adv_tab {	width: 100%;	}
	.adv_tab > input + label {	font-size: 12px; padding-right: 5px; width:80px;}
	.adv_tab .adv_tabpanels {
	left: 80px;
	width: calc(100% - 80px);
	}
	.adv_tab > input:first-child:checked ~ #homeback{padding-top:950px!important;}
	.adv_tab > input:nth-child(3):checked ~ #homeback{padding-top:250px!important;}
}
/*:::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::*/

#hojo-top a{color: #fff;}
#hojo-top {
	position: fixed;
	bottom: 80px;
	right: 20px;
	font-size: 100%;
  display: inline-block;
  padding:6px 4px;
  font-size: 14px;
  font-weight: bold;
  min-width: 130px;
  background: linear-gradient(170deg, #1e75dfbb 55%, #d3dfeebb);
  letter-spacing: 1px;
  color: #fff;
  box-sizing: border-box;
  border-radius: 50px;
  line-height: 1.3;
}
#hojo-top:hover{  background: linear-gradient(170deg, #002f8c 55%, #1e75df);}
#hojo-top::after { /* 三角形の表示設定 */
  content: "";
  margin: auto;
  position: absolute;
  top: 0;
  bottom: 0;
  right: 8px; /* 要素の左からの距離 */
  width: 0;
  height: 0;
  border-top: solid 2px #fff;
  border-right: solid 2px #fff;
  width: 6px;
  height: 6px;
  transform: rotate(45deg);
  transition: .2s ease-in-out;
}
#hojo-top:hover::after { /* 三角形の表示設定 */
	transform:  translateX(5px) rotate(45deg) ;
}

/*ページトップへスクロール*/
dl#hojo-page{display: none;
	position: fixed;
	bottom: 80px;
	right: 2%;
	font-size: 100%;
  border:#00c 3px solid;
  border-radius: 8px;
  background:  linear-gradient(180deg, #7ba3ff ,#1b56dc 10px,#1b56dc 20px,#0233a5 25px,#1b56dc 52px, #fffe 52px);
  user-select: none;
  opacity: .8;
}
dl#hojo-page dt{
  color: #fff;
  padding: 4px 8px;
  font-weight: bold;
}
dl#hojo-page dd{
  padding: 2px 5px 5px;
  margin: 0;
  text-align: center;
  color: #333;
}
dl#hojo-page .midashi{
  font-size: 14px;
  font-weight: bold;
  line-height: 0.8;
  text-align: center;
  position: absolute;
  top: -14px;
  left: -18px;
  width: 32px;
  height: 22px;
  padding-top: 9px;
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
  color: #e00;
  border: 3px solid #00c;
  border-radius: 50%;
  background: rgb(253, 255, 134); 
  transform: rotate(-10deg);
}

p.h-b-title{display: inline-block; margin: 0 2px; padding: 0; line-height: 1.1; }
a.h-b-link{
  color: #217fc4;
  text-decoration: underline double 1px #217fc4;
  padding: 2px 1em;
  border-radius: 4px;
  margin: auto;
  display: inline-block;
}
dl#hojo-page:hover{opacity: 1;}

.h-top-midashi{
  display: none;
  width:80%;
  color: #fff;
  font-size: 16px;
  font-weight: bold;
  background: linear-gradient(170deg, #1e75df 55%, #d3dfee);
  border: 2px solid #fff;
  box-shadow: #aaa 0 0 5px;
  padding: 10px;
  margin: 20px auto 30px;
  border-radius: 10px;
}



@media only screen and (max-width:570px) {
  #hojo-top, #hojo-page{display: none;}
}