html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
}
html{
	background:#F8B400;
}

h1, h2, h3, h4, h5, h6 {
    font-weight: 600;
}

main h1, main h2, main h3 {
	color:black;
}

main h1{
	letter-spacing:0;
}

main .marker_l{
	left:50%;
	transform: translateX(-50%);
}
main .marker_b::after{
	background:rgb(229, 0, 18, .6);
}

main .pure-form{
	margin:1.25em 0 2.25em 0;
}


.pure-button-primary, a.pure-button-primary {
    background-color:black;
}
.pure-button-primary, a.pure-button-light {
    background-color:rgb(28,42,78, .55);
	color:white;
}

main .pure-form{
	position: relative;
}

main .pure-form button{
	position:absolute;
	height:34px;
	padding-left:10px;
	padding-right:10px;
	border-radius:0 4px 4px 0;
	top:0;
	right:0;
}

/*				 			*/
/*		pagelink 			*/
/*				 			*/
main ul.pageLink{
	margin-top:0;
}

@media screen and (min-width: 568px){
	main .pageLink li {
		margin: 0 0.25em;
	}
	main .pageLink span.prev, main .pageLink span.prev_top {
		margin-right: 0;
	}	
	main .pageLink span.next, main .pageLink span.next_end {
		margin-left: 0;
	}
}
@media screen and (min-width: 768px){
	main .pageLink li {
		margin: 0 0.5em;
	}
	main .pageLink span.prev, main .pageLink span.prev_top {
		margin-right: 0.25em;
	}	
	main .pageLink span.next, main .pageLink span.next_end {
		margin-left: 0.25em;
	}
}

/*					 		*/
/*			header			*/
/*							*/

header, nav {
	background:#F8B400;
}

header li a,
header li i{
}

.navbar_toggle_icon{
}

.navbar_menu > ul {

    box-shadow:0 1px 3px #ddd;
}

.navbar_menu > ul > li {
    border-top: 0.5px solid black;
}

.navbar_menu > ul > li,
.navbar_menu > ul > li > a{
	font-weight: bold;
}

.navbar_menu > ul li.active > a,
.navbar_menu > ul li.active > i,
.navbar_menu .sub.selected > div{
	color:#e50012;
}

.navbar_menu > ul li.active > i.arrow::before {
	border-color:#e50012;
}


.navbar_brand{
    left: 1.11em;
    transform: translate(0, -50%);
}

.navbar_menu .sub ul {
    border-color:black;
}

@media screen and (max-width: 568px) {
	.navbar_menu .sub ul li{
		display: inline-block;
		margin-right:1em;
	}
}

@media screen and (min-width: 568px) {	
	header, nav {
		background:transparent;
	}
	
	nav {
		font-size:14px !important;
	}
	
	.navbar_brand{
		left:inherit;		
	}
	
	.navbar_menu > ul {
		background:transparent;		
		justify-content: end;
		box-shadow:none;
		margin-right: 163px;
	}	
		
	.navbar_menu > ul > li{
		padding: 3px 0 0 0.75em;
	}

	.navbar_menu > ul > li,
	.navbar_menu > ul > li > a{
		border:none;
	}

	.navbar_menu > ul li:hover{
		opacity:inherit;
	}

	
	.navbar_menu > ul > li > a::after,
	.navbar_menu > ul > li > i::after{
		content: '';
		display: block;
		height: 1px;
		width: 80%;
		margin:3px 10% 0 10%;
		background: 
			linear-gradient(rgb(229, 0, 18) 0 0) 
			bottom /var(--d, 0) 1px 
			no-repeat;
		transition:0.3s;
	}

	.navbar_menu > ul > li > i::after{
		position: absolute;	
	}
	
	.navbar_menu > ul > li > a:hover,
	.navbar_menu > ul > li > i:hover{
		--d: 100%;
	}
		
	.navbar_menu > ul  li  a:hover,
	.navbar_menu > ul  li  i:hover{
		transition:0.3s;
		color:rgb(229, 0, 18);
	}

	.navbar_menu > ul li i:hover::before {
		transition:0.3s;
		border-color:#e50012;
	}
	
	
	.navbar_menu > ul > li.active > a::after,
	.navbar_menu > ul > li.active > i::after{
		content: '';
		display: block;
		height: .5px;		
		width: 80%;
		margin:3px 10% 0 10%;
		background-color:rgb(229, 0, 18);
	}
	
	.navbar_menu .sub ul{
		width:9em;
		right:-0.5em;
	}
	
	header.mini{
		background:#F8B400;
		transition:background 0.5s;
	}
	
	.arrow::before{
		border-color:white;
	}
}


@media screen and (min-width: 768px) {
	.navbar_menu > ul {
		margin-right: 177px;
	}	
		
	.navbar_menu > ul > li{
		padding-left:2em;
	}
}




/*		ヘッダー買取査定ボタン		*/
	

.navbar_bt, .navbar_bt .wrap,
header.mini	.navbar_bt, header.mini	.navbar_bt .wrap{
	width:170px;
	height:44px;		
}

.navbar_bt{
	right:66px;
	top:50%;
	transform: translate(0,-50%);
	display:block;
}

.navbar_bt .wrap{
	color:rgba(0,0,0,0);
	text-decoration: none;
	transition:background 0.3s;
	border-radius: .125rem;
	background-image: -webkit-gradient(linear, left top, right top, from(#b2dec6), color-stop(51%, #009042), to(#b2dec6));
	background-size: 200% auto;
	overflow: hidden;
	float:left;
}

.navbar_bt .wrap:hover{
	background-position: right center;
}

.navbar_bt .bt,
header.mini	.navbar_bt .bt{
	padding:11px 0 0 30px;
	width:calc(170px - 30px);
	height:44px;
	font-weight:bold;		
	color:white;
	background:url('../img/kaitori_BT.svg') no-repeat;
	background-size: auto 20px;
	background-position:8px 12px;
}	

@media screen and (min-width: 568px) {
	.navbar_bt, .navbar_bt .wrap,
	header.mini	.navbar_bt, header.mini	.navbar_bt .wrap{
		width:150px;
	}
	.navbar_bt{
		right:0;
	}
	.navbar_bt .bt,
	header.mini	.navbar_bt .bt{
		width:calc(150px - 30px);
	}
}

/*					 		*/
/*			main title		*/
/*							*/

legend.title {
    margin-bottom:2.5em;
	height:200px;
	opacity:1;
}

legend.title h1, legend.title small{
	color:#fff;
}

legend.title small, h1 small{
	font-family: "Helvetica Neue", "Helvetica", "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Arial", "Yu Gothic", "Meiryo", sans-serif;
	letter-spacing: 0.15em;
}

legend.title img.image{
	opacity:1;
}

legend.title .wrap{
	background-color:rgb(0,0,0,.7);
	padding:0.5em 1em;
}


@media screen and (min-width: 568px) {
	legend.title {
    	margin-bottom:1em;
		height:240px;
		/*margin-top:-66px;*/
	}
	
	legend.title .wrap{
		top:52.5%;
	}
}

@media screen and (min-width: 768px) {
	legend.title {
		height:280px;
	}
}
@media screen and (min-width: 1024px) {
	legend.title {
		height:320px;
	}
}




/*					 		*/
/*			footer			*/
/*							*/
footer{
	padding-bottom:0.5em;
}

footer .logo {
    height: 44px;
	margin-bottom:0.75em;
    width: auto;
}
footer a{
	font-weight: bold;
	margin:0 0.75em;
}

footer small a{
	margin:0;
}


footer p{
	line-height:1.75em;
}

footer .copyright {
    margin: 0.5em 0 0 0 !important;
}



/*					 		*/
/*			1280px	over	*/
/*							*/


@media screen and (min-width: 1072px) {
	html{
		background-color:white;
		height:100%;
	}
	
	body{
		background:#F8B400;
		box-shadow: 0 0 3rem -1.5rem hsl(200 50% 20% / 60%);
		min-height:100%;
		overflow-x: hidden;
	}
	
	html > body{
	  height: auto; /* 要素を超えた分の背景が伸びないブラウザ用 */
	}	
	
	body, header, footer{
		width:1072px;
		margin-left:auto;
		margin-right:auto;
	}
	
}