@charset "utf-8";
/* CSS Document */

/*-----------↓下層共通----------------*/

.subpage #kyoutuuheader{
  background-color: white;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
}

.subpage #kyoutuuheader a {
  color: black;
	font-size: 1.6rem;
}

.mail_mark_text{
	color: #fff;
}

@media screen and (max-width: 1080px) {
    .flexBoxHeader {
        display: block;
        position: fixed;
		background: #fff;
    }
}

/*-----------↓パンくず----------------*/
.breadcrumbs {
    height: 35px;
	position: relative;
} 

.breadcrumbs ul{
	position: absolute;
	left: 10%;
}

.breadcrumbs ul li {
    margin: 0 10px 0 0;
    float: left;
	color: #1E1E1E;
	line-height: 35px;
	list-style: none;
}

.breadcrumbs ul li:first-child{
	margin-left: 1rem;
}
 
.breadcrumbs ul li:first-child::before {
    padding: 0 3px 0 0;
    content: none;
}
 
.breadcrumbs li a{
	color:  #1E1E1E;
}

@media screen and (max-width: 1080px) {
	.breadcrumbs{
		position: static;
	}
	.breadcrumbs ul{
		position: static;
	}
	.breadcrumbs ul li:first-child{
	margin-left: 30px;
}
}


	@media screen and (max-width:415px){
	
	.breadcrumbs{
		display: none;
	}
}
/*-----------↓タイトルと文字のとこ----------------*/

.kasouimg {
	height: 240px;
	position: relative;
	z-index: -1;
	background-position: right;	
	margin-top:70px;
}


@media screen and (max-width:1080px){
	.kasouimg {
	margin-top:57px;
}
}
.kasouimg p {
	color: #fff;
	font-weight: bold;
	font-size: 6rem;
	position: absolute;
	left: 10%;
	top: 130px;
	transform: translateY(-50%);
	z-index: 99;
	line-height: 0.5;
	text-align: center;
}

.kasouimg span {
	color: #fff;
	font-weight: normal;
	font-size: 16px;
	z-index: 99;
	}
	

/*------------------　#pageNav　------------------------*/

@media screen and (min-width:720px){
	.kasouSubmenu{
	display: flex;
	height: 50px;
	/*width: 768px;*/
	margin: 40px auto 15px;
	justify-content: center;
}
}


@media screen and (min-width:430px){
	.kasouSubmenu{
		display: flex;
		justify-content: center;
		margin-bottom: 2rem;
	}
}


.button-8{
	width: 220px;
  height:50px;
  float:left;
  text-align:center;
border: #134e82 solid 1px;
	margin: 0 1rem;
}
.button-8 a{
  font-size:18px;
  color:#134e82;
  text-decoration:none;
  line-height:50px;
  transition:all .5s ease;
  z-index:2;
  position:relative;
	display: block;
	
}


.button-8:hover{
  border:#73BBC1 solid 1px;
	transition: 0.5s;
}

.button-8 a:hover{
	color: #73BBC1;
	transition: 0.5s;
}

.kasouSubmenu_box{
		margin: 4em auto;
	}
	
@media screen and (max-width:430px){

	.kasouSubmenu_box {
		margin: 2rem auto;
	}
	.button-8, .button-8 a{
		height: 3rem;
		line-height: 3rem;
		font-size: 16px;
	}
}

	
	@media screen and (max-width:430){
	.kasouimg p{
		font-size: 5rem;
		top:7rem;
	}
	
		.kasouimg{
			height: 120px;
		}
	

	}
		
/*---------.kasouSubmenu ------------------*/		
@media screen and (max-width:430px){

		.kasouSubmenu{
			display: block;
			margin-bottom: 0;
		}
		.button-8, .eff-8{
			width: 100%;
			margin: 0 auto;
		}
	.button-8{
		border: none;
		position: relative;
		display: inline-block;
	}
	
	.button-8::after{
		content: "";
		position: absolute;
		bottom: 0;
		left:50%;
		transform: translateX(-50%);
		width: 15rem;
		border-bottom: 1px dotted #134e82;
	}
	

}

.top_fadein{
	animation: top-fadein 1s ease-out;
}
@keyframes top-fadein{
	0%{
		opacity: 0;
		transform: translateY(20px);
	}
	100%{
		opacity: 1;
		transform: translateY(0);
	}
}

@media screen and (max-width:800px){
section{
		padding: 3rem;
	}
	
	.kasouimg{
		height: 150px;
	}
	
	.kasouimg p{
		font-size: 3.5rem;
		left: 3rem;
    top: 80px;
		
	}
}



/*------size table_design09-------*/
#size{
	padding: 6rem;
}

#size h3{
	margin-top: 5rem;
}

.small{
	font-size: 1.2rem;
}

.table_design09 {
  border-collapse: collapse;
  table-layout: fixed;
  width: 100%;
  max-width: 450px;
  overflow: hidden;
  text-align: center;
	margin: 0 auto;
}
.table_design09 tr {
  background-color: #f1f8ff;
}
.table_design09 tr:nth-child(even) {
  background-color: #fff;
}
.table_design09 th, .table_design09 td {
  padding: 0.8rem;
}
.table_design09 thead th {
  background-color: #1760a1;
  color: #fff;
  text-align: center;
}

/*------size table_design08-------*/
.table_design08 {
  border-collapse: collapse;
  table-layout: fixed;
  width: 100%;
  max-width: 900px;
  text-align: center;
	margin: 0 auto 3rem;
}
.tb-color1{
	 background-color: #f1f8ff;
}
.tb-color2{
	 background-color: #fff;
}
.table_design08 th, .table_design08 td {
  border: 1px solid #D1E5F8;
  padding: 0.5em;
}
.table_design08 thead th {
  background-color: #1760a1;
  color: #fff;
 border: 1px solid #1760a1;
  border-right: 1px solid #fff;
  border-bottom: 1px solid #fff;
}
.table_design08 thead th:last-of-type {
  border-right: 2px solid #1760a1;
}
.table_design08 tbody th {
  color: #1760a1;
  font-weight: bold;
  text-align: center;
}
@media screen and (max-width: 640px) {
	#size{
	padding: 4rem;
}
	#size h3{
		margin-top: 0;
	}
	#size-bobbin, #size-kg{
		margin-top: 5rem;
	}
  .table_design08 {
    text-align: left;
  }
  .table_design08 thead {
    display:none;
  }
  .table_design08 th, .table_design08 td {
    display: block;
    border: 0;
    border-bottom: 2px solid #e6f1f6;
  }
  .table_design08 tbody th{
    background: #1760a1;
    color:#fff;
  }
  .table_design08 td::before{
    content: attr(data-label);
    color: #1760a1;
    font-weight: bold;
    display: inline-block;
    width: 20%;
    min-width: 4em;
  }
	.tb-color1{
		background-color: #fff;
	}
	.table_design08{
		margin: 0 auto;
	}
	.table_design08 tr{
		margin-top: 1rem;
	}
	
}