@charset "UTF-8";

/*!
Theme Name: g_plas
Description: ガンプラ買取
Theme URI: https://criche.co.jp
Author: Celestie
Author URI: https://criche.co.jp
Template:   cocoon-master
Version:    1.1.2
*/

/************************************
** 子テーマ用のスタイルを書く
************************************/
/*必要ならばここにコードを書く*/

section{
	padding-top:10px !important;
	padding-bottom: 50px !important;
}

table tr:nth-of-type(2n){
	background-color: #fafbfc;
}

.track{
	background-color: #ffd500;
	bottom: 0;
	height: 50px;
	position: fixed;
	width: 100%;
	z-index: 90000;
}
.track_f{
	bottom: 40vh;
	right: 0px;
	position: fixed;
	z-index: 90000;
}
.track .btn_form{
	background-color: #073164;
	color: #ffd500;
	font-weight: bold;
	text-align: center;
	margin: 5px auto;
	width: 50%;
}


#campaign{
	background-color: #d80c18;
	background-image: url(./img/02bk.png);
	background-repeat: no-repeat;
	background-size: 100%;
	background-position: top center;
	position: relative;
}

#campaign img{
	margin:50px auto;
	width: 80%;
}

#overview{
	background-color: #074e9a;
}

#overview .overview_list{
	display: flex;
	flex-wrap: wrap;
	margin: 50px auto;
	width: 80%;
}

#overview .overview_list,
#overview .flow_list{
	display: flex;
	flex-wrap: wrap;
	margin: 50px auto;
	width: 80%;
}

#overview .overview_list .item{
	width: 45%;
	margin-bottom: 50px;
}

#overview .overview_list .item img{
	width: 100%;
}

#overview li:nth-of-type(2n){
	margin-left: 10%;
}

#overview .overview_list div,
#overview .flow_list div{
	background-color: #073164;
	color: #ffd500;
	font-weight: bold;
	text-align: center;
	margin: 5px 0;
}

#overview .overview_list p,
#overview .flow_list p{
	color: #fff;
}

#overview .flow_list .item{
	width: 30%;
	margin-bottom: 50px;	
}

#overview .flow_list li:nth-of-type(2),
#overview .flow_list li:nth-of-type(3){
	margin-left: 5%;
}


#list_voice{
	background-color: #d80c18;
}

#list_voice table{
	border: 2px solid #ffd500;
}

#list_voice table tr:nth-of-type(2n){
	background-color: #f5f5f5;
}

#list_voice table th{
	background-color: #000;	
	color: #fff;
}

#list_voice .list,
#q_a .qa_list,
#list_voice img,
#q_a img,
.sec_from{
	margin:50px auto;
	width: 80%;	
}

#q_a{
	background-color: #074e9a;
}

#q_a .question{
	background: #073164;
	color: #ffd500;
	padding: 10px 10px 10px 20px;
}

#q_a .answer{
	color: #fff;
}

#contact_f{
	background-color: #d80c18;
}

#contact_f .reason2{
	color: #fff;
}

#contact_f .btn_form{
	background-color: #073164;
	color: #ffd500;
	font-weight: bold;
	text-align: center;
	margin: 5px 0;	
}

#contact_f .icon {
    display: inline-block;
    color: #fff;
    background: #E60012;
    font-size: 12px;
    line-height: 1;
    padding: 2px 5px;
    margin: 0 0 0 .8em;
}

#contact_f .select_dbox{
	margin-bottom: 50px;
}

#contact_f .select_dbox label{
	font-weight: bold;
}

#contact_f .box_pic{
	display: flex;
}

#contact_f .box_pic img{
	max-width: 50%;
	width: 300px;
}

#footer{
	margin-bottom: 50px;
}

.mfp_inactive_phase{
	display: none;
}

.title{
	margin: 0 auto;
	padding-top: 50px;
	height: 150px;
	width: auto !important;
}
.title_f{
	text-align: center;
	padding-top: 50px;
}

/************************************
** レスポンシブデザイン用のメディアクエリ
************************************/
/*1023px以下*/
@media screen and (max-width: 1023px){
  /*必要ならばここにコードを書く*/
}

/*834px以下*/
@media screen and (max-width: 834px){
  /*必要ならばここにコードを書く*/
	.track_f{
		bottom: 0 !important;
		display: flex;
		right: 0;
		position: fixed;
		z-index: 90000;
    }

	section{
		padding-top:1px !important;
		padding-bottom: 5px !important;
	}	
	
	#campaign img{
		width: 90%;
	}
	
	#overview .overview_list,
	#overview .flow_list{
		margin-bottom: 25px;
		width: 90%;
	}
	
	#overview .overview_list .item,
	#overview .flow_list .item{
		width: 100%;
		margin-bottom: 25px;
	}
	#overview li:nth-of-type(2n),
	#overview .flow_list li:nth-of-type(3){
		margin-left: initial;
	}
	
	#list_voice .list,
	#q_a .qa_list,
	#list_voice img,
	#q_a img,
	.sec_from{
		margin:25px auto;
		width: 90%;	
	}
	
	.title{
		height: 100px;
		max-width: 90%;
	}
	
 	table th,
 	table td {
		border-bottom: none;
		display: block;
		width: 100%;
	}
	
}

/*480px以下*/
@media screen and (max-width: 480px){
  /*必要ならばここにコードを書く*/
}


.container{
	background-color: #d80c18;
}

@media screen and (max-width: 834px){
	.thanks_mess br{
		display: none;
	}
}