
/*pc_css*/
@media screen and (min-width:751px){
	
	#introduction #header ul li.nintro a{
		font-weight: bold;
	}
	
	#introduction .arrowbox{
		text-align: center;
		margin:20px 0;
	}
	
	#introduction .arrowbox img{
		width:20px;
		height:auto;
	}
	
	#introduction .introtl01{
		font-size:1.2em;
		position: relative;
		text-align: left;
		line-height: 1em;
		color:#212943;
		margin:0 0 20px 0;
		font-weight: bold;
	}
	
	#introduction .introtl01 span{
		font-size:0.6em;
		font-weight: normal;
	}
	
	#introduction .introtl01 table{
		width:100%;
	}
	
	#introduction .introtl01 table td{
		vertical-align: middle;
		border-left:1px solid #2b2b2b;
		padding:5px 5px 0 5px;
	}
	
	#introduction .introtl01 table td:first-child{
		width:52px;
	}
	
	#introduction .introtl01 table td:last-child{
		padding:5px 10px 0 10px;
	}
	
	#introduction .introtl01 table td:first-child img{
		width:100%;
	}
	
	#introduction .square_tl{
    display: inline-block;
	width:100%;
    position: relative;
    padding: 0.5em 1.4em;
    text-decoration: none;
    background: #fff;/*ボタン色*/
    color: #2b2b2b;
	font-weight: bold;
	margin:0 0 20px 0;
	letter-spacing: 0.2em;
	box-sizing: border-box;
	border-top:1px solid #2b2b2b;
	border-left:1px solid #2b2b2b;
    border-bottom: solid 5px #2b2b2b;/*ボタン色より暗めに*/
    border-right: solid 5px #2b2b2b;/*ボタン色より暗めに*/
}

#introduction .square_tl:before{    
    content: " ";
    position: absolute;
    bottom: -5px;
    left: -1px;
    width: 0;
    height: 0;
    border-width: 0 5px 5px 0px;
    border-style: solid;
    border-color: transparent;
    border-bottom-color: #FFF;
}

#introduction .square_tl:after{   
    content: " ";
    position: absolute;
    top: -1px;
    right: -5px;
    width: 0;
    height: 0;
    border-width: 0px 5px 5px 0px;
    border-style: solid;
    border-color: #FFF;
    border-bottom-color: transparent;
}

	
	#introduction .cap{
		display:inline-block;
		text-decoration: underline;
		font-size:0.85em;
		text-align: left;
		line-height: 1.3em;
		margin:10px 0 40px 0;
	}
	
	#introduction .cap2{
		font-size:0.85em;
		text-align: left;
		line-height: 1.3em;
		margin:10px 0 0 0;
	}
	
	#introduction .stepbox{
	}
	
	#introduction .stepnumbox{
		font-size:1.3em;
		position: relative;
		text-align: left;
		line-height: 1.5em;
		color:#212943;
		margin:0 0 0 0;
		border:1px solid #cfd8dc;
	}
	
	#introduction .stepnumbox table{
		width:100%;
	}
	
	#introduction .stepnumbox table td.tt{
		vertical-align:top !important;
		padding:10px 5px;
	}
	
	#introduction .stepnumbox table td{
		vertical-align: middle;
		padding:10px 5px;
	}
	
	#introduction .stepnumbox table td:first-child{
		width:47px;
	}
	
	#introduction .stepnumbox table td:last-child{
		padding:10px 10px 10px 10px;
	}
	
	#introduction .stepnumbox table td:first-child img{
		width:100%;
	}
	
	
	#introduction .stepbox .listbox{
		padding:60px 15% 40px 15%;
		border-right:1px solid #cfd8dc;
		border-left:1px solid #cfd8dc;
	}
	
	#introduction .stepbox .listbox .inbox{
		border:1px solid #2b2b2b;
		padding:15px 10px 25px 10px;
		border-radius:10px;
		-moz-border-radius:10px;
		-webkit-border-radius:10px;
		position:relative;
	}
	
	#introduction .stepbox .listbox .inbox .illbox{
		position:absolute;
		top:-25px;
		left:0;
		width:100%;
		z-index:500;
		text-align: center;
	}
	
	#introduction .stepbox .listbox .inbox .illbox img{
		width:70%;
		height:auto;
		max-width:114px;
	}
	
	#introduction .stepbox .listbox .inbox .inner{
		padding:25px 15px 30px 15px;
		border:1px solid #2b2b2b;
		position:relative;
		z-index:400;
	}
	
	#introduction .stepbox .listbox .inbox .inner .listtl{
		border-bottom:2px solid #565656;
		text-align: center;
		margin:0 0 10px 0;
		padding:0 0 5px 0;
	}
	
	#introduction .stepbox .listbox .inbox .inner .listtl img{
		width:80%;
		max-width: 70px;
		height: auto;
	}
	
	#introduction .stepbox .listbox .inbox .inner .illbox2{
		width:30px;
		position:absolute;
		right:-3px;
		bottom:-5px;
	}
	
	#introduction .stepbox .listbox .inbox .inner .illbox2 img{
		width:100%;
		height:auto;
	}
	
	#introduction .stepbox .listbox .inbox .inner .checklist{
		padding:0 0 2px 0;
		margin:0 0 10px 0;
		border-bottom:1px dashed #2b2b2b;
		text-align: left;
		font-weight: bold;
		padding-left:28px;
		text-indent: -28px;
		line-height: 1.3em;
	}
	
	#introduction .stepbox .listbox .inbox .inner .checklist:before{
		margin:-3px 15px 0 0;
    	content:" ";
    	display:inline-block;
    	width:13px;
    	height:13px;
    	background:url("../images/introduction/man/icon01.png") left 50% no-repeat;    
    	background-size:contain;
    	vertical-align:middle;
	}
	
	#introduction .stepbox .linebox{
    	padding:40px 10px;
		border:1px solid #cfd8dc;
		position: relative;
	}
	
	#introduction .stepbox .linebox .illbox{
    	position:absolute;
		top:-15px;
		width:40px;
		left:50%;
		margin:0 0 0 -20px;
	}
	
	#introduction .stepbox .linebox .illbox img{
    	width:100%;
	}
	
	#introduction .stepbox .linebox .txbox{
    	text-align: center;
		margin:0 0 10px 0;
	}
	
	#introduction .stepbox .linebox .lineurlbox{
		margin:0 auto 20px ;
		text-center;
	}
	
	#introduction .stepbox .linebox .lineurlbox img{
    	width:100%;
		max-width: 107px;
	}
	
	#introduction .stepbox .linebox a.mail{
    	background:#7b7b7b;
		border-radius:10px;
		-moz-border-radius:10px;
		-webkit-border-radius:10px;
		display: block;
		text-decoration: none;
		color:#fff;
		transition:all 0.3s;
	}
	
	#introduction .stepbox .linebox a.mail:hover{
    	background:#2b2b2b;
	}
	
	#introduction .stepbox .linebox a.mail table{
		width:100%;
	}
	
	#introduction .stepbox .linebox a.mail table td{
		vertical-align: middle;
		padding:12px 10px;
		word-break: break-all;
		line-height: 1.5em;
	}
	
	#introduction .stepbox .linebox a.mail table td:first-child{
		width:28px;
		border-right:2px solid #fff;
		line-height: 0;
	}
	
	#introduction .stepbox .linebox a.mail table td:first-child img{
		width:100%;
	}
	
	#introduction .introtl05{
		font-size:1em;
		position: relative;
		text-align: left;
		line-height: 1.5em;
		color:#fff;
		background:url("../images/membership/man/bg.gif") repeat;
		background-size:4px 4px;
		padding:2px;
		box-sizing: border-box;
		margin:10px 0 0 0;
	}
	
	#introduction .introtl05.woman{
		font-size:1em;
		position: relative;
		text-align: left;
		line-height: 1.5em;
		color:#fff;
		background:url("../images/introduction/woman/bg01.png") repeat;
		background-size:4px 4px;
		padding:2px;
		box-sizing: border-box;
		margin:10px 0 0 0;
	}
	
	#introduction .introtl05 table{
		width:100%;
		border:1px solid #fff;
		letter-spacing: 0.1em;
		font-size:0.95em;
		box-sizing: border-box;
		display: block;
	}
	
	#introduction .introtl05.woman table{
		width:100%;
		border:1px solid #fff;
		letter-spacing: 0.1em;
		font-size:1.2em;
		box-sizing: border-box;
		display: block;
	}
	
	#introduction .introtl05 table td{
		vertical-align: middle;
	}
	
	#introduction .introtl05 table td:first-child{
		width:38px;
		padding:12px 0 12px 12px;
	}
	
	#introduction .introtl05 table td:first-child img{
		width:100%;
	}
	
	#introduction .introtl05 table td:last-child{
		padding:12px 12px 12px 15px;
	}
	
	#introduction .floatbox{
		width:100%;
		padding:5px;
		border:2px solid #e1e4e7;
		box-sizing: border-box;
		line-height: 1.5em;
		margin:10px 0;
	}
	
	#introduction .floatbox table{
		width:100%;
		table-layout: fixed;
	}
	
	#introduction .floatbox table td{
		text-align: center;
		vertical-align: middle;
		padding:10px;
	}
	
	#introduction .floatbox table td span{
		font-size:1.2em;
	}
	
	#introduction .floatbox table td strong{
		font-size:1.2em;
	}
	
	#introduction .floatbox table td:first-child{
		border-right:2px solid #e1e4e7;
	}
}



@media screen and (max-width:750px){
	#introduction #header ul li.nintro a{
		font-weight: bold;
	}
	
	#introduction .maincontainer{
		margin:60px 0 0 0;
	}
	
	#introduction .arrowbox{
		text-align: center;
		margin:20px 0;
	}
	
	#introduction .arrowbox img{
		width:20px;
		height:auto;
	}
	
	#introduction .introtl01{
		font-size:1.2em;
		position: relative;
		text-align: left;
		line-height: 1em;
		color:#212943;
		margin:0 0 20px 0;
		font-weight: bold;
	}
	
	#introduction .introtl01 span{
		font-size:0.6em;
		font-weight: normal;
	}
	
	#introduction .introtl01 table{
		width:100%;
	}
	
	#introduction .introtl01 table td{
		vertical-align: middle;
		border-left:1px solid #2b2b2b;
		padding:5px 5px 0 5px;
	}
	
	#introduction .introtl01 table td:first-child{
		width:52px;
	}
	
	#introduction .introtl01 table td:last-child{
		padding:5px 10px 0 10px;
	}
	
	#introduction .introtl01 table td:first-child img{
		width:100%;
	}
	
	#introduction .square_tl{
    display: inline-block;
	width:100%;
    position: relative;
    padding: 0.5em 1.4em;
    text-decoration: none;
    background: #fff;/*ボタン色*/
    color: #2b2b2b;
	font-weight: bold;
	margin:0 0 20px 0;
	letter-spacing: 0.2em;
	box-sizing: border-box;
	border-top:1px solid #2b2b2b;
	border-left:1px solid #2b2b2b;
    border-bottom: solid 5px #2b2b2b;/*ボタン色より暗めに*/
    border-right: solid 5px #2b2b2b;/*ボタン色より暗めに*/
}

#introduction .square_tl:before{    
    content: " ";
    position: absolute;
    bottom: -5px;
    left: -1px;
    width: 0;
    height: 0;
    border-width: 0 5px 5px 0px;
    border-style: solid;
    border-color: transparent;
    border-bottom-color: #FFF;
}

#introduction .square_tl:after{   
    content: " ";
    position: absolute;
    top: -1px;
    right: -5px;
    width: 0;
    height: 0;
    border-width: 0px 5px 5px 0px;
    border-style: solid;
    border-color: #FFF;
    border-bottom-color: transparent;
}

	
	#introduction .cap{
		display:inline-block;
		text-decoration: underline;
		font-size:0.85em;
		text-align: left;
		line-height: 1.3em;
		margin:10px 0 40px 0;
	}
	
	#introduction .cap2{
		font-size:0.85em;
		text-align: left;
		line-height: 1.3em;
		margin:10px 0 0 0;
	}
	
	#introduction .stepbox{
	}
	
	#introduction .stepnumbox{
		font-size:1.3em;
		position: relative;
		text-align: left;
		line-height: 1.5em;
		color:#212943;
		margin:0 0 0 0;
		border:1px solid #cfd8dc;
	}
	
	#introduction .stepnumbox table{
		width:100%;
	}
	
	#introduction .stepnumbox table td.tt{
		vertical-align:top !important;
		padding:10px 5px;
	}
	
	#introduction .stepnumbox table td{
		vertical-align: middle;
		padding:10px 5px;
	}
	
	#introduction .stepnumbox table td:first-child{
		width:47px;
	}
	
	#introduction .stepnumbox table td:last-child{
		padding:10px 10px 10px 10px;
	}
	
	#introduction .stepnumbox table td:first-child img{
		width:100%;
	}
	
	
	#introduction .stepbox .listbox{
		padding:60px 12% 40px 12%;
		border-right:1px solid #cfd8dc;
		border-left:1px solid #cfd8dc;
	}
	
	#introduction .stepbox .listbox .inbox{
		border:1px solid #2b2b2b;
		padding:15px 10px 25px 10px;
		border-radius:10px;
		-moz-border-radius:10px;
		-webkit-border-radius:10px;
		position:relative;
	}
	
	#introduction .stepbox .listbox .inbox .illbox{
		position:absolute;
		top:-25px;
		left:0;
		width:100%;
		z-index:500;
		text-align: center;
	}
	
	#introduction .stepbox .listbox .inbox .illbox img{
		width:70%;
		height:auto;
		max-width:114px;
	}
	
	#introduction .stepbox .listbox .inbox .inner{
		padding:25px 15px 30px 15px;
		border:1px solid #2b2b2b;
		position:relative;
		z-index:400;
	}
	
	#introduction .stepbox .listbox .inbox .inner .listtl{
		border-bottom:2px solid #565656;
		text-align: center;
		margin:0 0 10px 0;
		padding:0 0 5px 0;
	}
	
	#introduction .stepbox .listbox .inbox .inner .listtl img{
		width:80%;
		max-width: 70px;
		height: auto;
	}
	
	#introduction .stepbox .listbox .inbox .inner .illbox2{
		width:30px;
		position:absolute;
		right:-3px;
		bottom:-5px;
	}
	
	#introduction .stepbox .listbox .inbox .inner .illbox2 img{
		width:100%;
		height:auto;
	}
	
	#introduction .stepbox .listbox .inbox .inner .checklist{
		padding:0 0 2px 0;
		margin:0 0 10px 0;
		border-bottom:1px dashed #2b2b2b;
		text-align: left;
		font-weight: bold;
		padding-left:28px;
		text-indent: -28px;
		line-height: 1.3em;
	}
	
	#introduction .stepbox .listbox .inbox .inner .checklist:before{
		margin:-3px 15px 0 0;
    	content:" ";
    	display:inline-block;
    	width:13px;
    	height:13px;
    	background:url("../images/introduction/man/icon01.png") left 50% no-repeat;    
    	background-size:contain;
    	vertical-align:middle;
	}
	
	#introduction .stepbox .linebox{
    	padding:40px 10px;
		border:1px solid #cfd8dc;
		position: relative;
	}
	
	#introduction .stepbox .linebox .illbox{
    	position:absolute;
		top:-15px;
		width:40px;
		left:50%;
		margin:0 0 0 -20px;
	}
	
	#introduction .stepbox .linebox .illbox img{
    	width:100%;
	}
	
	#introduction .stepbox .linebox .txbox{
    	text-align: center;
		margin:0 0 10px 0;
	}
	
	#introduction .stepbox .linebox .lineurlbox{
		margin:0 auto 20px ;
		text-center;
	}
	
	#introduction .stepbox .linebox .lineurlbox img{
    	width:100%;
		max-width: 107px;
	}
	
	#introduction .stepbox .linebox a.mail{
    	background:#7b7b7b;
		border-radius:10px;
		-moz-border-radius:10px;
		-webkit-border-radius:10px;
		display: block;
		text-decoration: none;
		color:#fff;
		transition:all 0.3s;
		font-size:0.9em;
	}
	
	#introduction .stepbox .linebox a.mail.line{
    	background:#00b300;
		border-radius:10px;
		-moz-border-radius:10px;
		-webkit-border-radius:10px;
		display: block;
		text-decoration: none;
		color:#fff;
		transition:all 0.3s;
		font-size:0.9em;
		margin:0 0 30px 0;
	}
	
	#introduction .stepbox .linebox a.mail:hover{
    	background:#2b2b2b;
	}
	
	#introduction .stepbox .linebox a.mail.line:hover{
    	background:#007e00;
	}
	
	#introduction .stepbox .linebox a.mail table{
		width:100%;
	}
	
	#introduction .stepbox .linebox a.mail table td{
		vertical-align: middle;
		padding:12px 10px;
		word-break: break-all;
		line-height: 1.5em;
	}
	
	#introduction .stepbox .linebox a.mail table td:first-child{
		width:28px;
		border-right:1px solid #fff;
		line-height: 0;
	}
	
	#introduction .stepbox .linebox a.mail.line table td:first-child{
		width:28px;
		border-right:1px solid #00a700;
		line-height: 0;
	}
	
	#introduction .stepbox .linebox a.mail table td:first-child img{
		width:100%;
	}
	
	#introduction .introtl05{
		font-size:1em;
		position: relative;
		text-align: left;
		line-height: 1.5em;
		color:#fff;
		background:url("../images/membership/man/bg.gif") repeat;
		background-size:4px 4px;
		padding:2px;
		box-sizing: border-box;
		margin:10px 0 0 0;
	}
	
	#introduction .introtl05.woman{
		font-size:1em;
		position: relative;
		text-align: left;
		line-height: 1.5em;
		color:#fff;
		background:url("../images/introduction/woman/bg01.png") repeat;
		background-size:4px 4px;
		padding:2px;
		box-sizing: border-box;
		margin:10px 0 0 0;
	}
	
	#introduction .introtl05 table{
		width:100%;
		border:1px solid #fff;
		letter-spacing: 0.1em;
		font-size:0.95em;
		box-sizing: border-box;
		display: block;
	}
	
	#introduction .introtl05.woman table{
		width:100%;
		border:1px solid #fff;
		letter-spacing: 0.1em;
		font-size:1.2em;
		box-sizing: border-box;
		display: block;
	}
	
	#introduction .introtl05 table td{
		vertical-align: middle;
	}
	
	#introduction .introtl05 table td:first-child{
		width:38px;
		padding:12px 0 12px 12px;
	}
	
	#introduction .introtl05 table td:first-child img{
		width:100%;
	}
	
	#introduction .introtl05 table td:last-child{
		padding:12px 12px 12px 15px;
	}
	
	#introduction .floatbox{
		width:100%;
		padding:5px;
		border:2px solid #e1e4e7;
		box-sizing: border-box;
		line-height: 1.5em;
		margin:10px 0;
	}
	
	#introduction .floatbox table{
		width:100%;
		table-layout: fixed;
	}
	
	#introduction .floatbox table td{
		text-align: center;
		vertical-align: middle;
		padding:10px;
	}
	
	#introduction .floatbox table td span{
		font-size:1.2em;
	}
	
	#introduction .floatbox table td strong{
		font-size:1.2em;
	}
	
	#introduction .floatbox table td:first-child{
		border-right:2px solid #e1e4e7;
	}
}
	