@charset "utf-8";

@media screen and (max-width: 950px) {

/* -----------------------------------------------------------------------------

ナビ　アクティブ設定

----------------------------------------------------------------------------- */

/* 第2階層オープン */
header .inner .navWrap #gnav > ul > li#navContact .subMenu {
	display: block;
}
.contactTop header .inner .navWrap #gnav > ul > li#navContact .subMenu {
	display: none;
}
/* ｐお問い合わせTOP */
.contactTop #navContact > a > span,
.contact #navContact > a > span {
	border-bottom: 2px solid #e60012;
}
}
@media screen and (max-width: 750px) {

/* -----------------------------------------------------------------------------

お問い合わせ扉

----------------------------------------------------------------------------- */
/* ttl
---------------------------------------------*/
.contactTop #pageTtl.ttlImg {
	background-image: url(https://www.marubeni.com/jp/contact_form/img/bg_main.jpg);
}
.contactTop #contactGuide h3 + p {
	margin-bottom: 0!important;
}	

/* -----------------------------------------------------------------------------

お問い合わせフォーム

----------------------------------------------------------------------------- */
/* 共通
---------------------------------------------*/
.form section .lead span{
	display: block;
	font-size: 1.2rem;
	text-indent: -1em;
	margin-left: 1em;
	margin-top: 10px;
	color: #666;
}
	
.form section .step {
	margin: 5px 0 20px;
	text-align: left;
	display: table;
	width: 100%;
}
.form section .step li {
	display: table-cell;
	width: 33.33333%;
	position: relative;
}
.form section .step li:after {
	content: "";
	width: 24%;
	height: 1px;
	border-top: 1px dotted #000;
	box-sizing: border-box;
	position: absolute;
	right: -13%;
	top: 10px;
}
.form section .step li .num {
	width: 54%;
	height: 25px;
	display: block;
	line-height: 25px;
	font-size: 1.3rem;
	text-align: center;
	position: relative;
	background: #efefef;
	margin: 0 auto;
}
.form section .step li.active .num {
	background: #cb151d;
	color: #fff;
}
.form section .step li.active .num:after {
	content: "";
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 12.5px 0 12.5px 6px;
	border-color: transparent transparent transparent #cb151d;
	position: absolute;
	right: -6px;
	top: 0;
}
.form section .step li .txt {
	display: block;
	font-weight: bold;
	text-align: center;
	margin-top: 10px;
	font-size: 1.5rem;
}
.form section .step li:last-child:after {
	content:none;
}
.form section table {
	margin: 30px auto 0;
}
/* text, textaera */
.form input[type="text"],
.form input[type="tel"],
.form input[type="email"] {
	padding: 10px 15px;
	width: 100%;
	font-size: 1.6rem;
	line-height: 1.5;
}
.form textarea {
	font-size: 1.6rem;
}
/*select*/
.form select {
	width:210px;
	background: url(https://www.marubeni.com/jp/common/img/sp/icon_arrow_btm.png) no-repeat 96% center;
	background-size: 11px;
	-webkit-appearance: none;
	border-radius: 0;
	font-size: 1.6rem;
}

/*error*/ 
.form .error input[type="radio"] + label:before,
.form .error input[type="checkbox"] + label:before,
.form .error input[type="text"],
.form .error input[type="tel"],
.form .error input[type="email"],
.form .error textarea,
.form .error select{
	border: 1px solid #e60012;
	background-color: #fff6f6!important;
}

	
/* input
---------------------------------------------*/
/*error*/
.form.input section .errorBox {
	background: #fff6f6;
	border: 1px solid #e60012;
	margin: 30px auto 0;
	padding: 25px 20px;
}
.form.input section .errorBox p,
.form.input section .errorBox li {
	color: #e60012;
}
.form.input section .errorBox p {
	font-weight: bold;
	font-size: 1.6rem;
	margin-bottom: 20px!important;
}
.form.input section .errorBox ul li {
    font-size: 1.2rem;
    margin-top: 6px;
}
/*form*/
.form.input section table th {
	padding-right:55px;
	box-sizing: border-box;
}
.form.input section table th.req {
	background: url(https://www.marubeni.com/jp/contact_form/img/sp/form/icon_req.gif) no-repeat 95% center #efefef;
	background-size: 33px;
}
.form.input section table th.any {
	background: url(https://www.marubeni.com/jp/contact_form/img/sp/form/icon_any.gif) no-repeat 95% center #efefef;
	background-size: 33px;
}
.form.input section table td p span {
	margin-bottom: 0;
}
.form.input section table td {
	vertical-align: middle;
	padding: 16px 15px 25px;
}
/*list*/
.form.input section#form table td .list {
	margin-right: -3%;
}
.form.input section table td .list li {
	display: block;
	width: 50%;
	margin: 7px 0;
	float: left;
	padding-right: 3%;
}
.form.input section table td .list li.listWidthM {
	width: 50%;
}
.form.input section table td .list li.listWidthL {
	width: 100%;
	margin: 10px 0;
}
.form.input section table td .list li:last-child {
	margin-right: 0;
}
/*group*/
.form.input section table td .group {
	padding: 15px 0;
	border-top: 1px dotted #b2b2b2;
}
.form.input section table td .group:first-child {
	border-top: 0;
	padding-top: 0;
}
.form.input section table td .group:last-child {
	padding-bottom: 0;
}
.form.input section table td .group dt {
	font-weight: bold;
}
.form.input section table td .group dd {
	margin-top: 7px;
}
/*zip*/
.form.input section table .zip p {
    display: inline-block;
    margin-bottom: 10px!important;
    width: 100%;
}
.form.input section table .zip .zipInput01 {
	width: 34%;
}
.form.input section table .zip .zipInput02 {
	width: 45%;
}
.form.input section #zipSet {
    width: 39%;
    border: 1px solid #ccc;
    height: 45px;
    line-height: 45px;
    text-align: center;
    margin-left: 17px;
    background: #f8f8f8;
    vertical-align: top;
}

/*secureImg*/
.form.input section table td .secureImg img {
	width: 76%!important;
	line-height: 1;
	border: 1px solid #ccc;
	box-sizing: border-box;
	display: inline-block;
}
.form.input section table td .secureImg a {
	display: inline-block;
	color: #e60012;
	text-decoration: underline;
	font-size: 1.3rem;
	margin-left: 2%;
}
.form.input section table td .imgTxt {
	margin-top: 20px;
}
.form.input section table td .imgTxt ul {
	margin-top: 10px;
	color: #666;
}
.form.input section table td .imgTxt ul li {
	text-indent: -1em;
	margin-left: 1em;
	font-size: 1.1rem;
}

/*agreement*/
.form.input section .agreement {
	margin: 25px auto 0;
	background: #f8f8f8;
	padding: 23px 0;
	font-size: 1.3rem;
}
.form.input section .agreement .txt {
	text-align: center;
	margin-bottom: 0!important;
}
.form.input section .agreement .agree {
	text-align: center;
	margin-top: 20px;
	margin-bottom: 0!important;
	font-weight: bold;
}
/*btn*/
.form.input section .confirm {
	width: 63%;
	margin: 20px auto 0;
}
.form.input section .confirm input[type="submit"] {
	display: block;
	text-align: center;
	font-size: 1.4rem;
	border: 1px solid #ccc;
	padding: 20px 6% 20px 0;
	background: url(../common/img/sp/icon_arrow_r.png) 92% center no-repeat;
	background-size: 6px;
	width: 100%;
	border-radius: 0;
}
/* confirm
---------------------------------------------*/
.form.confirm  section .btnArea {
	text-align: center;
	margin: 40px auto 0;
}
.form.confirm  section .btnArea p {
	width: 48%;
	height: 70px;
	line-height: 1!important;
}
.form.confirm  section .btnArea .return {
	float: left;
}
.form.confirm  section .btnArea .submit {
	float: right;
}
.form.confirm  section .btnArea .return a {
	display: table;
	padding: 0 0 0 2%;
	border: 1px solid #ccc;
	height: 70px;
	background: url(../common/img/sp/icon_arrow_l.png) 8% center no-repeat;
	background-size: 6px;
	width: 100%;
	line-height: 1.4;
}
.form.confirm  section .btnArea .return a span {
	display: table-cell;
	vertical-align: middle;
}
.form.confirm  section .btnArea .submit input[type="submit"]{
    display: block;
    text-align: center;
    font-size: 1.4rem;
    color: #fff;
    background: url(../common/img/sp/icon_arrow_w.png) 92% center no-repeat #cb151d;
    background-size: 6px;
    padding: 0 2% 0 0;
    width: 100%;
    line-height: 70px;
    cursor: pointer;
    border: 1px solid #cb151d;
    border-radius: 0;
    height: 70px;
}
/* thanks
---------------------------------------------*/
.form.thanks section .thanksTxt {
	font-size: 1.9rem;
	margin-bottom: 0!important;
}
.form.thanks section .thanksTxt + .lead {
	margin-top: 20px;
}
.form.thanks section .btn.back {
	width: 63%;
	margin: 50px auto 0;
}
.form.thanks section .btn.back a {
	height:45px;
	line-height:45px;
}
/* form01
---------------------------------------------*/
.form.input #form01 table td .listGroup li {
	display: block;
	margin: 20px 0 0 0;
	padding: 0;
}
.form.input #form01 table td .listGroup li > label {
	font-weight: bold;
}
.form.input #form01 table td .listGroup li:first-child {
	margin-top: 0;
}
.form.input #form01 table td .list .category {
	margin-top: 5px;
}
.form.input #form01 table td .list .category li {
	display: inline-block;
	width:auto;
	margin: 2px 0;
}
.form.input #form01 table td .list  .category li:after {
	content: "/";
	display: inline-block;
	margin: 0 2px 0 4px;
}
.form.input #form01 table td .list  .category li:last-child:after {
	content:none;
}
.form.input #form01 table td .list > li:last-child {
	padding: 20px 0 0 0;
	border-top: 1px dotted #b2b2b2;
}
/* form03
---------------------------------------------*/
.form.input #form03 table td .release > li {
	display: block;
	margin: 0;
	padding: 0;
}
.form.input #form03 table td .release > li:first-child {
	padding: 0 0 20px 0;
	border-bottom: 1px dotted #b2b2b2;
	margin-bottom: 18px;
}
.form.input #form03 table td .release > li label {
	font-weight: bold;
}
.form.input #form03 table td .release > li dt {
	margin-bottom: 6px;
}
.form.input #form03 table td .release > li dt {
	margin-top: 12px;
}
.form.input #form03 table td .release input:disabled {
	background: #efefef;
}

/*
.form.input #form03 table td .release.acd dl {
	overflow: hidden;
	max-height: 0;
	-webkit-transition: all .5s;
	transition: all .5s;
}
.form.input #form03 table td .release.acd dl.active {
	max-height: 200px;
}
*/
/* form05
---------------------------------------------*/
.form.input #form05 .lead {
	margin-bottom: 10px!important;
}
.form.input #form05 .btn.arrow a:hover {
	background-color: #f3f3f3;
}
.form.input #form05 .step {
	margin-top: 40px;
}
}


@media screen and (max-width: 620px) {
	.form.input section table td .group:nth-child(5) .list li {
		width: 100%;
	}
}

@media screen and (max-width: 320px) {
	.form.input section table td {
		padding-left: 0;
		padding-right: 0;
	}
}