@charset "utf-8";
/* ===================================================================
CSS information
 file name  :  parts.css
 style info :  各パーツ
=================================================================== */
/* position dots in carousel */
.flickity-page-dots {
  bottom: 20px; /* navの配置位置*/
}
/* white circles */
.flickity-page-dots .dot {
  width: 10px;
  height: 10px;
  opacity: 1;
  background: transparent;
  border: 2px solid white;
}
/* fill-in selected dot */
.flickity-page-dots .dot.is-selected {
  background: white;
}
/* -------------------------------------------------------------------
Main Vitoual
 ----------------------------------------------------------------- */
 .flickity-prev-next-button{
 display:none;
 }
div#mv{
   width: 100%;
   height:350px;
}
div#mv img{ 
   width: 1020px;
	height: 350px;
}
div#mv-sub{
	width: 100%;
	height:170px;
	background: #888;	
	position: relative;
	}
div#mv-sub h2{
	text-align: center;
	margin: 0 auto;
	color: #FFF;
	position: absolute;
	top: 65px;
	right:20%;
	left:20%;
	
}
div#mv-sub.abourt-proro{
    background: url(../image/mv-sub_about-proro.jpg) no-repeat ;
    background-position:center center;
    background-size: cover;
}
div#mv-sub.how-to{
    background: url(../image/mv-sub_how-to.jpg) no-repeat;
    background-position:center center;
    background-size: cover;
}
div#mv-sub.product{
    background: url(../image/mv-sub_product.jpg) no-repeat;
    background-position:center center;
    background-size: cover;
}
div#mv-sub.download{
    background: url(../image/mv-sub_download.jpg) no-repeat;
    background-position:center center;
    background-size: cover;
}
div#mv-sub.contact{
    background: url(../image/mv-sub_contact.jpg) no-repeat;
    background-position:center center;
    background-size: cover;
}
div#mv-sub.news{
    background: url(../image/mv-sub_news.jpg) no-repeat;
    background-position:center center;
    background-size: cover;
}
div.location{
width:100%;
}
div.location{
 font-size: 0.85em;
 }
 
div.location a{
 color:#444444;
} 
 
div.location a:hover{
 color: #AAA;
 text-decoration:none; 
}
div.location ul{
 width:1020px;
 margin:5px auto;
}
div.location ul li:first-child{
background:none;
padding-left:0;
}
div.location ul li{
 line-height: ;
 float: left;
 margin-right: 15px;
 background: url(../image/icon_arrow.png) no-repeat;
 background-position: left center;
 padding-left: 20px;
 }
 
#location ul li.current {
    padding: 0 10px;
    color: #666;
    background: no-repeat scroll 0% 0% transparent;
    }
dl.product-details{
 text-align: left;
 font-size: 0.9em;
 
}
dl.product-details dt{
 float: left;
 width: 25%;
 box-sizing: border-box;
 background-color: #eee;
 padding: 2px 15px 4px;
 display: table;
}
dl.product-details dd{
 float: left;
 width: 75%;
 box-sizing: border-box;
 padding: 2px 15px 4px;
 background: #fafafa;
}
dl:after,dd:after,dt:after{
clear: both;
content: "";
display: block;
}
div#contents.company_box{
 margin-top:0px;
 padding-bottom: 100px;
}
.company_box .box-inner{
 width: 60%;
}
.company_box section p{
  font-size: 1.0em;
  line-height: 2.0em;
  text-align: left;
}
.company_box section p.large{
  font-size: 1.2em;
  line-height: 1.9em;
  /*padding-left: 1.0em;*/
}
.company_box section p.small{
  font-size: 0.85em;
  line-height: 2.0em;
  color:#888;
  padding-left: 2.0em;
}
.company_box section h3{
 font-size: 1.4em;
 margin:30px 0 6px 0;
}
.company_box section h4{
 font-size: 1.3em;
 margin:30px 0 6px 0;
}
dl.dl_company a,
.company_box a{
 color:#4f72bc;
 font-weight:100;
 font-size:0.9em;
}
dl.dl_company dt:first-child{
font-weight:100;
}
dl.dl_company dt{
 font-weight:700;
}
dl.dl_company dd{
 margin-bottom: 20px;
 }
 
img.logo_company{
	width: 300px;
	max-width:100%;
	height: auto;
}
table.product-details,
table.product-details_3rows {
 text-align: left;
 width: 100%;
 font-size: 0.86em;
 margin: 15px 0 20px;
}
table.product-details tr{
}
table.product-details th{
 width: 30%;
 box-sizing: border-box;
 background-color: #eee;
 padding: 2px 15px 4px;
 border-bottom: 1px #fafafa solid;
 vertical-align: top;
}
table.product-details td{
 width: 70%;
 box-sizing: border-box;
 padding: 2px 15px 4px;
 background: #fafafa;
 border-bottom: 1px #fefefe solid;
}
table.product-details_3rows th{
 width: 10%;
 box-sizing: border-box;
 padding: 2px 15px 4px;
 border-bottom: 1px #fafafa solid;
 vertical-align: top;
 background-color: #eee;
 border-left: 1px #fafafa solid;
}
table.product-details_3rows th:nth-child(2){
 width: 10%;
}
table.product-details_3rows td{
 width: 80%;
 box-sizing: border-box;
 padding: 2px 15px 4px;
 background: #fafafa;
 border-bottom: 1px #fefefe solid;
}
dl.dl_small{
min-width: 300px;
}
dl.dl_small dt{
 float: left;
 width: 25%;
 font-weight:700;
}
dl.dl_small dd{
 float: left;
 width: 75%;
}
.video_area {
  height: 100%; // 高さを画面いっぱいに指定する。(vhが効かない場合の対策)
  height: 100vh; // 高さを画面いっぱいに指定する。
  position: relative;  //横幅がウィンドウズサイズの縦幅よりもはみ出てしまう場合に、左にずらすために指定。
  width: 100%; // 横幅もいっぱいに。
}
.video_area{
 
}
#video {
  border:12px solid #eee;
  width: 80%;
  background: url('/video_bg.jpg') no-repeat; 
  box-sizing: border-box;
}
@media screen and (max-width: 979px){
.flickity-page-dots .dot{
    width: 6px;
    height: 6px;	
  }
  
div#mv{
   margin-top: 56px;
   width: 100%;
   height:250px;
}
div#mv ul li.gallery-cell{
   position: relative;
   min-width: 100%;
   width: auto;
   height:250px;
}
div#mv img{ 
position: absolute;
width: 100%;
height: auto;
}
div#mv-sub{
	margin-top: 56px;
	}
dl.product-details{
 margin-bottom: 30px;
 }
dl.product-details dt{
 width: 35%;
 overflow: hidden;
}
dl.product-details dd{
 width: 65%;
}
img.logo_company{
 width:50%;
 margin-bottom:70px;
}
div.location ul{
    width: 100%;
    padding: 0 10px;
    box-sizing: border-box;
    }
    
div#contents.company_box{
margin-top:60px;
}
.company_box .box-inner{
 width:100%;
}
}
@media screen and (max-width: 1024px) {
div#mv-sub{
	margin-top:56px;
	}
	}
@media screen and (max-width: 767px) {
div#mv{
   margin-top: 56px;
   width: 100%;
   height:180px;
}
div#mv ul li.gallery-cell{
   height:180px;
}
div#mv img{ 
position: absolute;
min-width: 100%;
min-height: 180px;
}
div#mv-sub{
	margin-top: 56px;
	}
}
@media screen and (max-width: 479px){
div#mv{
height: 140px;
}
div#mv ul li.gallery-cell{
    height: 140px;
}
div#mv img{ 
max-width: 100%;
width: auto;
min-height: 140px;
}
#video{
  width:100%;
}
}
/* -------------------------------------------------------------------
News Area
 ----------------------------------------------------------------- */
dl.news_box{
	margin-bottom: 50px;
}
.news_box dt{
	padding: 16px 0; 
	float:left;
	width: 200px;
	}
	
.news_box dt time{
	float: left;
	margin: 3px 5px 3px 0;
}
.news_box dt span{
	display: inline-block;
	float: right;
}
.news_box dd{
	border-top: 1px solid #d9d9d9;
	padding: 18px 0 16px 215px;
	text-align: left;
	}
	
.news_box dd:last-child{
	border-bottom: 1px solid #d9d9d9;
	}
	
.news_detail{
	text-align: left;
	background: #fefefe;
	padding:60px 80px;
	box-sizing: border-box;
}
.news_detail time{
	text-align: left;
	margin-right: 10px;
	font-weight:100;
	margin-bottom: 30px;
	display: inline-block;
}
.news_detail span{
	display: inline-block;
}
span.label{
	width: 84px;
	font-size: 0.8em;
	text-align: center;
	padding: 4px 0;
	line-height: 1.4em;
	margin-top: 5px;
	color: #fff;
}
span.label.news{
	background: #e7a483;
}
span.label.event{
	background: #39a0c6;
}
	
ul.back_no li{
 float: left;
 margin-right: 15px;
 background: url(../image/icon_arrow.png) no-repeat;
 background-position: left center;
 padding-left: 20px;
	
}
@media screen and (max-width: 767px) {
	
dl.news_box:after{
clear: both;
content: "";
display: block;
}
}
@media screen and (max-width: 468px){
dl.news_box{
 border-top: 1px solid #d9d9d9;
}
.news_box dt{
	padding: 10px 0 0 0; 
	float:none;	
	}
.news_box dt span{
	display: inline-block;
	float: right;
}
.news_box dd{
	border-top: none;
	padding: 5px 0 16px 0px;
	border-bottom: 1px solid #d9d9d9;
	}
}
/* -------------------------------------------------------------------
program 
 ----------------------------------------------------------------- */
section div.dl_box{
  background-color: #FFF;
  box-sizing: border-box;
  margin-bottom:20px;
  padding:0 0 30px 0;
  position: relative;
  min-height: 100%;
  overflow: hidden;
}
section div.dl_box h3.dl_title{
 background: #33ac99;
 color:#fff;
 margin-bottom: 30px;
 line-height: 2.2em;
 text-align: left;
 padding-left: 30px;
  -webkit-border-top-left-radius: 4px;
  -moz-border-top-left-radius: 4px;
  border-top-left-radius: 4px;
  -webkit-border-top-right-radius: 4px;
  -moz-border-top-right-radius: 4px;
  border-top-right-radius: 4px;
}
section div.dl_box .btn_box{
 /*position: absolute;
 bottom:15px;
 right:30px;*/
 float:right;
}
section div.dl_box .col_2_left{
 float: left;
 padding: 0 30px;
 box-sizing: border-box;
 text-align: left; 
 width:25%;
 min-height:auto;
}
section div.dl_box .col_2_right{
 float: right;
 padding: 0 30px;
 box-sizing: border-box;
 text-align: left; 
 width:75%;
 min-height:auto;
 
}
section div.dl_box_inner{
 /*width: 70%; */
 min-height: auto;
 display:block;
 
}
section div.dl_box_inner:after,
.col_2_right:after,
section div.dl_box_inner dl:after{
clear: both;
content: "";
display: block;
margin-bottom:1px;
}
section div.dl_box_inner dl{
 margin-top:10px;
}
section div.dl_box_inner dt{
 float: left;
 width: 70px;
 background: #eee;
 padding:0 10px;
 border: 1px solid #eee;
}
section div.dl_box_inner dd{
 float: left;
 width: 150px;
 padding:0 10px;
 border: 1px solid #eee;
}
a.weight_dl{
  color: #ffffff;
  font-size: 1.2em;
  background: #ffbf00;
  padding: 15px 30px !important;
    width: 120px;
}
.program_image img{
	width: 200px !important;
	height: auto;
}
@media screen and (max-width: 979px) {
section div.dl_box{
  background-color: #FFF;
  box-sizing: border-box;
  margin: 0 4% 20px 4%;
  padding:0 0 30px 0;
  width: 92%;
}
section div.dl_box_inner{
 width: 100%; 
}
section div.dl_box .col_2_left{
 padding: 0 30px;
 width:30%;
}
section div.dl_box .col_2_right{
 padding: 0 30px 0 0;
 width:70%;
 
}
}
@media screen and (max-width: 767px) {
section div.dl_box{
  position: static;
}
section div.dl_box .btn_box{
 position: static;
 float:none;
}
a.weight_dl{
  color: #ffffff;
  font-size: 1.2em;
  background: #ffbf00;
  padding: 15px 30px !important;
  width: 100%;
}
}
@media screen and (max-width: 468px){
section div.dl_box .col_2_left{
 float: none;
 padding: 0 30px 30px 30px;
 width:100%;
 display: block;
 box-sizing:border-box;
}
section div.dl_box .col_2_right{
 float: none;
 padding: 0 30px;
 width:100%;
 display: block;
}
section div.dl_box_inner d{
}
section div.dl_box_inner dt{
 float: left;
 width: 30%;
  box-sizing:border-box;
}
section div.dl_box_inner dd{
 float: left;
 width: 70%;
  box-sizing:border-box;
}
}
	
#submit[disabled] { 
	opacity:0.4;
 }


#submit01[disabled] { 
	opacity:0.4;
}

 
table {
    border-collapse: collapse;
    border-spacing: 0;
    }
    
img.icon_dl{
 width:18px;
 height:auto;
 vertical-align: middle;
 margin-top:-2px;
 
}
    
   
table.download01,
table.download02{
    width: 100%;
    text-align:left;	
    margin-top:30px;	
     margin-bottom:30px;	
}
table.download01 p,
table.download02 p{
	font-size:0.9em;
	margin-bottom:10px;
}
table.download01 td:nth-child(1) {
  width: 40%;
}
table.download01 td:nth-child(2){
  width: 15%;
  }
table.download01 td:nth-child(3),
table.download01 td:nth-child(4),
table.download01 td:nth-child(5) {
  width: 15%;
  text-align: center;
}
table.download02 td:nth-child(1) {
  width: 55%;
}
table.download02 td:nth-child(2),
table.download02 td:nth-child(3),
table.download02 td:nth-child(4) {
  width: 15%;
  text-align: center;
}
table.download01 td:nth-child(5),
table.download02 td:nth-child(4) {
  min-width: 100px;
}
table.download01 h4,
table.download02 h4{
margin-top:4px;
margin-bottom:4px;
}
table.download01 thead,
table.download02 thead{
background-color: #33ac99; 
font-weight:bold; 
text-align:center;
color:#fff;
}
table.download01 td,
table.download02 td{
	border-right: 1px dotted #CCCCCC;
	}
table.download01 td:last-child,
table.download02 td:last-child{
	border-right: none;
	}
	
table.download01 tr,
table.download02 tr{
	border-top: 1px dotted #CCCCCC;
	}
	
table.download01 tr:last-child,
table.download02 tr:last-child{
	border-bottom: 1px solid #CCCCCC;
	}
	
table.download01 td,
table.download02 td{
    padding: 10px 15px;
    vertical-align: middle;
}
table.download01 tbody tr:nth-child(odd) td,
table.download02 tbody tr:nth-child(odd) td {  
      background-color: #fff;  
    }
table.download01 tbody tr:nth-child(even) td,
table.download02 tbody tr:nth-child(even) td {  
      background-color: #f1f8f7;  
    }  
p.pdf{
background: url(../image/icon_pdf.png) no-repeat scroll left 0px;
padding: 0px 0px 4px 25px;
font-size:0.9em;
}
p.exe{
font-size:0.9em;
}	
.checkbox01-input{
  display: none;
  margin-right: 20px;
}
 .checkbox01-parts{
  padding-left: 23px;
  padding-top:1px;
  position: relative;
}
.checkbox01-parts::before{
  content: "";
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 15px;
  height: 15px;
  border: 1px solid #999;
  border-radius: 4px;
}
.checkbox01-input:checked + .checkbox01-parts{
  color: #ed6624;
}

a.text_link{
  color: #ed6624;
  text-decoration: underline;	
}
.checkbox01-input:checked + .checkbox01-parts::after{
  content: "";
  display: block;
  position: absolute;
  top: -5px;
  left: 5px;
  width: 7px;
  height: 14px;
  transform: rotate(40deg);
  border-bottom: 3px solid #ed6624;
  border-right: 3px solid #ed6624;
}

.space01{
float:left;
}
.kiyaku{
  margin: 30px 0;
  width: 100%;
  height: 520px;
  overflow: auto;
  border:#ccc 1px solid;
  padding:20px;
  box-sizing: border-box;
  background:#fff;
  text-align:left;
}

.kiyaku_all{
	margin: 30px 0;
	width: 100%;
	border:#ccc 1px solid;
	padding:20px;
	box-sizing: border-box;
	background:#fff;
	text-align:left;
}

.kiyaku p,
.kiyaku_all p{
 margin-bottom:10px;
 font-size:1.0em;
}
.kiyaku h3,
.kiyaku_all h3{
  text-align: center;
  margin-top:20px;
}
.kiyaku h4,
.kiyaku_all h4{
 margin-top:20px;
 font-size:1.0em;
 }

  
ol.decimal li  {
 list-style-type: decimal;
 margin-left: 2.0em;
 }
	
ol.parentheses{
  padding:0 0 0 1em;
  margin:0;
}
 
ol.parentheses li{
  list-style-type:none;
  list-style-position:inside;
  counter-increment: cnt;
}
ol.parentheses li:before{
  display: marker;
  content: "(" counter(cnt) ") ";
  }
	
@media screen and (max-width: 767px) {
table.download01,
table.download02{
	width:100%;
}
table.download01 td:nth-child(5),
table.download02 td:nth-child(4) {
  min-width: 100px;
}
table td a.weight_b4{
min-width:90px;
padding: 3px 5px;
font-size:0.9em;
}


.space01{
	float:none;


}
	
@media screen and (max-width: 640px){
table.download01,
table.download02{
	overflow: auto;
	white-space: nowrap;
	display:block;
	width:auto;
}