/*タブ**************************
*************************************
*************************************/
.tab1Padding01{
padding-top: 10px;
padding-right: 10px;
padding-bottom: 40px;
padding-left: 10px;
}

.tab1Padding02{
padding-top: 40px;
padding-right: 10px;
padding-bottom: 10px;
padding-left: 10px;
}

/*sp
---------------------------*/
.sp_device .tab1Padding01{
width: 90%;
margin-right: auto;
margin-left: auto;
display: block;
}


.sp_device .tab1Padding02{
width: 90%;
margin-right: auto;
margin-left: auto;
display: block;
padding-top: 15px;
}


/*タブ切り替え全体のスタイル*/
.tabs {
width: 100%;
margin-top: -30px;
margin-bottom: 0;
position: relative;
top: -50px;
}
.tabs h3 {
text-align: center;
margin-right: auto;
margin-left: auto;
padding-bottom: 15px;
}
.borderH3 {
border-bottom: 2px solid #B60005;
font-size: 2rem;
font-weight: bold;
}



/*タブのスタイル*/
.tab_item {
width: 184px;
height: 50px;
display: block;
float: left;
display: flex;          /* 2 */
justify-content: center;/* 3 */
align-items: center;    /* 4 */
background-image: url(/images/index_btn_tab_off.png);
font-size: 14px;
font-weight: bold;
color: #666666;
}

.tab_item:hover {


}

.tabsLine{
border-bottom: 2px solid #fff;
padding-top: 5px;
text-align: center;
}
.tabsLine:hover{
border-bottom: 2px solid #B60005;

}


/*ラジオボタンを全て消す*/
input[name="tab_item"] {
  display: none;
}


/*タブ切り替えの中身のスタイル*/
.tab_content {
display: none;
padding-top: 40px;
padding-right: 0px;
padding-left: 0px;
padding-bottom: 0;
clear: both;
overflow: hidden;
width: 100%;
height: 500px;
}


/*選択されているタブのコンテンツのみを表示*/
#all:checked ~ #all_content,
#programming:checked ~ #programming_content,
#design:checked ~ #design_content {
  display: block;
}

/*選択されているタブのスタイルを変える*/
.tabs input:checked + .tab_item {
background-image: url(/images/index_btn_tab_on.png);
background-position: 0px 0px;
background-color: none;
}

.tabs input:checked + .tab_item .tabsLine {
border-bottom: 2px solid #B60005;
}

.tabsP {
text-align: center;
font-size: 1.3rem;
line-height: 2rem;
}


/*タブsp**************************
*************************************
*************************************/

.sp_device .borderH3 {
border-bottom: 2px solid #B60005;
font-size: 2rem;
font-weight: bold;
}


.sp_device .tabsP {
text-align: left;
font-size: 1.5rem;
line-height: 2.25rem;
}





/*タブ切り替え全体のスタイル*/
.sp_device .tabs {
padding-bottom: 40px;
width: 100%;
margin-top: -100px;
margin-bottom: 0px;
position: relative;
top: 0px;
padding-top: 0px;
}

/*タブのスタイル*/
.sp_device .tab_item {
width: 33.333%;
height: 50px;
display: block;
float: left;
display: flex;          /* 2 */
justify-content: center;/* 3 */
align-items: center;    /* 4 */
background-image: url(/images/index_btn_sp_tab_off.png);
font-size: 12px;
font-weight: bold;
color: #666666;
border-right: 2px solid #C0C0C0;
}

.sp_device .tab_item:hover {


}



/*タブ切り替えの中身のスタイル*/
.sp_device .tab_content {
display: none;
padding-top: 40px;
padding-bottom: 0;
clear: both;
overflow: hidden;
height: auto;
}


/*選択されているタブのコンテンツのみを表示*/
#all:checked ~ #all_content,
#programming:checked ~ #programming_content,
#design:checked ~ #design_content {
  display: block;
}

/*選択されているタブのスタイルを変える*/
.sp_device .tabs input:checked + .tab_item {
background-image: url(/images/index_btn_sp_tab_on.png);
background-position: 0px 0px;
background-color: none;
border-right: 2px solid #C0C0C0;
}




/*タブ2**************************
*************************************
*************************************/
.tab2Inner{

}



.tab2:hover{
text-decoration: none!important;
}

.tab2Active{
font-size: 0.95em;
}

a.tab2Active span.tab2Off {
display: block;
width: 95%;
height: 120px;
margin-right: auto;
margin-left: auto;
text-align: center;
background-color: #ECECEC;
margin-bottom: 22px;
padding-top: 60px;
background-image: url(/images/top_icon_question.png);
background-repeat: no-repeat;
background-position: center 10px;
text-decoration: none;
border: none;
}

 a.tab2Active:hover span.tab2Off { 
 display:none!important;
 background-color: #7F7F7F;
 width: 95%;
height: 120px;
text-decoration: none!important;
border: none;
}

 a.tab2Active span.tab2On { 
 display:none; 
 text-decoration: none!important;
 border: none;
 }
 a.tab2Active:hover span.tab2On {
display: block;
background-color: #0075A9;
margin-right: auto;
margin-left: auto;
width: 95%;
height: 120px;
margin-bottom: 22px;
padding-top: 50px;
background-image: url(/images/top_icon_question_ovr.png);
background-repeat: no-repeat;
background-position: center 10px;
text-decoration: none!important;
border: none;
color: #FFFFFF;
font-weight: bold;
text-align: center;
}

 a.tab2Active span.tab2On2 { 
 display:none; 
 text-decoration: none!important;
 border: none;
 }
 a.tab2Active:hover span.tab2On2 {
display: block;
background-color: #0075A9;
margin-right: auto;
margin-left: auto;
width: 95%;
height: 120px;
margin-bottom: 22px;
padding-top: 60px;
background-image: url(/images/top_icon_question_ovr.png);
background-repeat: no-repeat;
background-position: center 10px;
text-decoration: none!important;
border: none;
color: #FFFFFF;
font-weight: bold;
text-align: center;
}

 a.tab2Active:hover { 
text-decoration: none!important;
border: none;
}

.tab2_dl{
padding-left: 15px;
padding-right: 15px;
padding-bottom: 15px;
margin-left: auto;
margin-right: auto;
padding-top: 15px;
margin-bottom: 30px;
border: 2px solid #E8E8E8;
width: 80%;
display: block;
}
.tab2_dl dt {
display: block;
font-size: 1.75rem;
background-image: url(/images/top_icon_question.png);
background-repeat: no-repeat;
padding-top: 7px;
padding-bottom: 12px;
padding-left: 37px;
margin-bottom: 5px;
background-position: left 4px;
border-bottom: 1px dotted #E8E8E8;
background-size: 30px auto;
}
.tab2_dl dd {
background-image: url(/images/top_icon_question_ovr2.png);
background-repeat: no-repeat;
background-position: left 4px;
background-size: 30px auto;
margin-left: 0px;
padding-left: 37px;
padding-top: 7px;
padding-bottom: 0px;
font-size: 1.75rem;
font-weight: bold;
}



/*sp
---------------------------*/
.sp_device .tab2Inner{

}

.sp_device .tab2Active{
font-size: 1.25em;
}

.sp_device a.tab2Active span.tab2Off {
margin-bottom: 0px;
margin-top: 0px;
font-size: 1.5rem;
}

.sp_device a.tab2Active:hover span.tab2On  {
margin-bottom: 0px;
margin-top: 0px;
font-size: 1.5rem;
}

.sp_device a.tab2Active:hover span.tab2On2  {
margin-bottom: 0px;
margin-top: 0px;
font-size: 1.5rem;
}

/*タブ3**************************
*************************************
*************************************/
.tab3{
margin-bottom: 40px;
}

.tab3Ttl{
font-size: 1.45rem;
font-weight: bold;
margin-bottom: 5px;
}

.tab3Cnt{
padding-bottom: 5px;
margin-left: 16px;
margin-bottom: 5px;
}

.tab3Cnt2{
font-size: 1.2rem;
font-weight: bold;
margin-left: 18px;
margin-bottom: 2px;
}

/*sp
---------------------------*/
.sp_device .tab3{
margin-bottom: 20px;
border-bottom: 1px dotted #C0C0C0;
padding-bottom: 0px;
}

.sp_device .tab3Ttl{
font-size: 1.75rem;
font-weight: bold;
margin-bottom: 5px;
display: table-cell;
width: auto;
margin-right: auto;
margin-left: auto;
text-align: center!important;
}

.sp_device .tab3Cnt{
padding-bottom: 5px;
margin-left: 16px;
margin-bottom: 5px;
font-size: 1.5rem;
}

.sp_device .tab3Cnt2{
font-size: 1.2rem;
font-weight: bold;
margin-left: 18px;
margin-bottom: 2px;
}


/*アコーディオンリスト
---------------------------*/
.aco_li li {
font-size: 1.75rem;
border-bottom: 2px solid #00202E;

}

/*チェックボックス
---------------------------*/

#contents {
			margin: 80px 40px 0;
		}
		#contents h2 {
			margin: 100px 0 20px;
			font-size: 20px;
		}
		#contents section:first-child h2 {
			margin-top: 0;
		}

		#example01 div {
			width: 200px;
			text-align: center;
		}
		#example01 p:first-child {
			margin-bottom: 20px;
		}
		#example01 p a { text-decoration: underline;}
		#example01 p a:hover { text-decoration: none;}

		#example02 p {
			overflow: hidden;
		}

button[type="submit"] {
width: 400px;
height: 65px;
background-color: #B60005;
border: none;
color: #fff;
-webkit-transition: background-color .2s;
transition: background-color .2s;
cursor: pointer;
-webkit-appearance: none;
border-radius: 5px;
text-align: center;
display: block;
border-width: 0px;
margin-right: auto;
margin-left: auto;
		}
button[type="submit"]:hover {
		background-color: #01557A;
}
button[type="submit"][disabled] {
		background-color: #C0C0C0;
		cursor: default;
}




		
		
.checkBlock {
		width: 100%;
		margin-right: auto;
		margin-left: auto;
		padding-top: 30px;
}
.checkBlock .checkBlock_checkBox {
width: 340px;
display: block;
margin-right: auto;
margin-left: auto;
-webkit-box-sizing: inherit;
-moz-box-sizing: inherit;
box-sizing: inherit;
text-align: center;
		}
.checkBlock .checkBlick_btn {
width: 469px;
margin-right: auto;
margin-left: auto;
display: block;
margin-top: 10px;
}
.btn_fz12 {
		font-size: 1.2rem;
		line-height: 1.5rem;
}

.sp_device button[type="submit"] {
width: 70%;
margin-right: auto;
margin-left: auto;
display: block;
margin-top: 10px;
float: none;
}



.agryboxRight{
text-align: left;
display: inline-block;
width: auto;
padding-left: 555px;
}

.sp_device .agryboxRight{
text-align: left;
display: block;
width: auto;
padding-left: 0px;
float: right;
}

.sp_device .checkBlock .checkBlick_btn {
		width: 100%;
		margin-right: auto;
		margin-left: auto;
		display: block;
		margin-top: 15px;
}

.checkboxStyle01 {
border: thin solid #5B5B5B;
width: 20px;
height: 20px;
margin-right: 4px;
}


