@charset "utf-8";

/* sidenav */
.side_nav {
display: none;
}

/* INDEX */
/* box_search */
.customer .box_search {
margin-bottom: 1.5rem;
}
.customer .box_search p {
display: table;
width: 100%;
}
.customer .box_search p span {
display: table-cell;
background: #FFF;
border-top-left-radius: 4px;
border-bottom-left-radius: 4px;
vertical-align: middle;
box-sizing: border-box;
}
.customer .box_search p span:last-child {
width: 30px;
text-align: right;
border-top-left-radius: 0;
border-bottom-left-radius: 0;
}
.customer .box_search input {
display: block;
}
.customer .box_search input[type="text"] {
padding: 8px 5px;
width: 100%;
font-size: 1.2rem;
}
#customer_index .box_search input[type="text"] {
padding: 5px;
background: transparent;
}
.customer .box_search input[type="button"] {
width: 30px;
height: 30px;
background: #333 url(https://www.mandom.co.jp/common/customer/images/ico_search_sp.svg) no-repeat 50% 50%;
background-size: 16px;
border-top-right-radius: 4px;
border-bottom-right-radius: 4px;
}
.customer .keyword a {
display: inline-block;
margin-right: 1rem;
color: #333;
text-decoration: underline;
}

/* tab */
#customer_index .tab {
margin: 3rem 0 1rem;
padding-right: 0;
padding-left: 0;
}
#customer_index .tab ul {
display: table;
width: 100%;
}
#customer_index .tab ul li {
display: table-cell;
padding: .7rem .5rem;
text-align: center;
font-size: 1.5rem;
border-bottom: 1px solid #FFF;
color: #333;
}
#customer_index .tab ul li a {
color: #333;
}
#customer_index .tab ul li span,
#customer_index .tab ul li a {
display: block;
text-align: center;
position: relative;
cursor: pointer;
}
#customer_index .tab ul li span.current:after {
position: absolute;
bottom: -0.8rem;
content: "";
display: block;
height: 2px;
width: 100%;
background: #333;
}
#customer_index .tab_contents {
display: none;
}
#customer_index .tab_contents.show{
display: block;
}

/* faq */
#customer_index .faq .btn_whitebox_arrow {
position: relative;
padding: 20px 30px 20px 40px;
margin-bottom: 10px;
}
#customer_index .faq .btn_whitebox_arrow:before {
position: absolute;
left:15px;
top:40%;
display: inline-block;
content: "Q";
font-size: 1.8rem;
font-family: 'IBM Plex Sans', sans-serif;
font-weight: 400;
color: #333;
line-height: 1;
}
#customer_index .wrap_movie {
background: #FFF;
padding: 10px 20px 20px;
}
#customer_index .wrap_movie > div {
position:relative;
width:100%;
padding-top:56.25%;
box-sizing: border-box;
}
#customer_index .wrap_movie > div iframe  {
position:absolute;
top:0;
right:0;
width:100%;
height:100%;
}
#customer_index .faq.movie .btn_whitebox_arrow {
margin-bottom: 0;
}

/* request */
#customer_index .request .col6 {
vertical-align: top;
}

/*contact*/
#customer_index .freedial,
#customer_detail .freedial {
margin: .6rem 0;
padding-left: 34px;
background: url(https://www.mandom.co.jp/common/images/common/ico_freedial.svg) no-repeat 0 50%;
background-size: 28px;
font-family: 'IBM Plex Sans', sans-serif;
font-style: italic;
font-weight: 600;
font-size: 2.8rem;
color: #657171;
}
#customer_index .time,
#customer_index .phone {
display: table;
width: 100%;
margin-bottom: 1rem;
}
#customer_index .time span,
#customer_index .phone span {
display: table-cell;
}
#customer_index .time span:first-child,
#customer_index .phone span:first-child {
color: #333;
}

/* links */
#customer_index .links a {
display: block;
padding: 1.5rem 2.8rem 1.5rem 0;
border-top: 1px solid #CCC;
border-bottom: 1px solid #CCC;
color: #333;
}
#customer_index .links a:nth-child(n+3) {
border-top: none;
}
#customer_index .links a.launch {
background: url(https://www.mandom.co.jp/common/images/common/ico_launch_green.svg) no-repeat 100% 50%;
background-size: 20px;
}
#customer_index .phone {
width: auto;
margin-top: 1rem;
}
#customer_index .phone span:first-child {
padding-right: 1rem;
white-space: nowrap;
}




/* Q&A LIST */
.list_qa .link_pulldown {
margin: 3rem 0 1rem;
}

.list_qa .trigger {
font-weight: 600;
color: #657171;
}


.list_qa .link_pulldown a {
padding-left: 40px;
}
.list_qa .link_pulldown a:before {
position: absolute;
left:15px;
top:20px;
display: inline-block;
content: "Q";
font-size: 1.8rem;
font-family: 'IBM Plex Sans', sans-serif;
font-weight: 400;
color: #333;
line-height: 1;
}
.list_qa .link_pulldown a.launch:before {
content: "";
width: 20px;
height: 20px;
background: url(https://www.mandom.co.jp/common/images/common/ico_launch_green.svg) no-repeat 100% 50%;
background-size: 20px;
}
.list_qa .link_pulldown li.title {
padding-top: 2rem;
padding-bottom: 1rem;
border-bottom:1px solid #AAD9DD;
}
.list_qa .tag_category {
margin-left: 1rem;
}


/*list_pager*/
.list_pager {
margin-top: 3rem;
font-size: 87.5%;
text-align: right;
}
.list_pager a {
display: inline-block;
padding: 8px 0 9px;
margin: 0 .2rem;
background: #f5f5f5;
width: 30px;
text-align: center;
line-height: 1;
color: #333;
}
.list_pager a:nth-child(n+7) {
display: none;
}
.list_pager a.prev,
.list_pager a.next {
display: inline-block;
}
.list_pager a.current {
background: #333;
color: #FFF;
font-weight: bold;
cursor: default;
}
.list_pager a.current:hover {
opacity: 1;
}
.list_pager a.prev,
.list_pager a.next {
position: relative;
text-indent: -9999px;
background: none;
width: 20px;
}
.list_pager a.prev:after,
.list_pager a.next:after {
position: absolute;
top:35%;
content: "";
display: block;
width: 7px;
height: 7px;
transform: rotate(45deg);
}
.list_pager a.prev:after {
left:50%;
border-left: 2px solid #333;
border-bottom: 2px solid #333;
}
.list_pager a.next:after {
right:50%;
border-right: 2px solid #333;
border-top: 2px solid #333;
}




/* Q&A DETAIL */
.detail_qa .question,
.detail_qa .answer {
position: relative;
padding-left: 3rem;
}
.detail_qa .question:before,
.detail_qa .answer:before {
position: absolute;
top:-5px;
left:0;
display: inline-block;
content: "Q";
font-size: 2.2rem;
font-family: 'IBM Plex Sans', sans-serif;
font-weight: 600;
color: #333;
}
.detail_qa .answer:before {
content: "A";
color: #f06666;
}
.detail_qa .question {
padding-bottom: 1.5rem;
margin-bottom: 1.5rem;
font-size: 112.5%;
font-weight: 600;
color: #333;
border-bottom: 1px solid #999999;
}
.detail_qa .answer figure {
//margin: 3rem 0;
}

.detail_qa .category_icon {
margin-top: 2rem;
}
.detail_qa .category_icon a {
display: inline-block;
margin-right: .5rem;
margin-bottom: .5rem;
padding: .5rem 1rem .6rem;
font-size:87.5%;
color: #FFF;
line-height: 1;
border-radius: 15px;
background: #0099a8;
}
.detail_qa .category_icon a.orange {
background: #de9100;
}

#customer_detail .list_form {
padding-top: 2rem;
padding-bottom: 2rem;
border-top: 1px solid #999;
border-bottom: 1px solid #999;
}

#customer_detail .list_form .btn_send {
display: block;
width: 100%;
padding:1.1rem 2.8rem 1.1rem 1.5rem;
font-size: 1.6rem!important;
}

.detail_qa .caption.indent {
    text-indent: -1em;
    padding-left: 1em;
    font-size: 1.6rem;
}

.answer ul {
    list-style-type: disc;
    list-style-position: outside;
    padding-left: 1.5rem;
    margin-left: 1.5rem;
}

.answer ul.list-decimal,
.answer ol {
    list-style-type: decimal;
    list-style-position: outside;
    padding-left: 1.5rem;
    margin-left: 1.5rem;
}

.detail_qa .img_120-1 {
	width: 100%;
	//min-height: 285px;
	margin: 1em auto;
	text-align: center;
	background: url(https://i-ask465.dga.jp/dispImage.php?id=22) no-repeat center 60px;
	background-size: 285px;
}
.detail_qa .img_120-1 h4 {
	font-weight: 700;
	font-size: 1.8rem;
	text-align: center;
	line-height: 1.5;
}
.detail_qa .img_120-1 p {
	padding: 1em 0;
}
.detail_qa .col1, .detail_qa .col2, .detail_qa .col3, .detail_qa .col4, .detail_qa .col5, .detail_qa .col6, .detail_qa .col7, .detail_qa .col8, .detail_qa .col9, .detail_qa .col10, .detail_qa .col11, .detail_qa .col12 {
	padding: 1.851% 0; 
	width: 100%; 
}

.col1, .col2, .col3, .col4, .col5, .col6, .col7, .col8, .col9, .col10, .col11, .col12 {
    vertical-align: top;
}

/* mat-pure bunner */
#btn_matp a {
	background-image: url(https://www.mandom.co.jp/common/images/common/ico_launch_green.svg);
	background-position: right 15px top 15px;
	background-repeat: no-repeat;
	background-size: 20px;
	text-align: center;
}

#btn_matp img {
	width: 90%;
	margin-left: -5px;
}

ul.col11.list_stylenone li {
	list-style-type: none;
	font-weight:bold;
}

/* product_recall-- */
ul.col11.list_decimal p,
ul.col11.list_stylenone p {
	display: block;
}

ul.col11.list_decimal p.pic,
ul.col11.list_decimal p.normal,
ul.col11.list_stylenone p.pic,
ul.col11.list_stylenone p.normal {
	display: inline-block;
	vertical-align: top;
}

ul.col11.list_decimal p.pic,
ul.col11.list_stylenone p.pic {
	width: 100%;
	margin-top: 10px;
	margin-right: 0;
	text-align: center;
}

ul.col11.list_decimal p.pic img,
ul.col11.list_stylenone p.pic img {
	width: 75%;
}

ul.col11.list_decimal p.pic.lc img,
ul.col11.list_stylenone p.pic.gb img,
ul.col11.list_stylenone p.pic.gb2 img  {
	width: 100%;
}

ul.col11.list_decimal p.normal,
ul.col11.list_stylenone p.normal {
	width: auto;
	margin-top: 20px
}

ul.col11.list_stylenone li ul {
	margin-left: 25px;
}

ul.col11.list_stylenone li ul li {
	list-style: disc;
}

.col12.center {
	padding: 0;
}

.col12.center p {
	text-align: center;
}
.va-m {
	vertical-align: middle;
	margin-right: 5px;
}

.fw_normal {
	font-weight:normal
}

.f_big {
	font-size: 150%;
}

.txt_uline {
	text-decoration: underline;
}
	
/* --product_recall */


@media screen and (min-width:768px) {

/* product_recall-- */
ul.col11.list_decimal p.pic,
ul.col11.list_decimal p.pic img,
ul.col11.list_decimal p.pic,
ul.col11.list_decimal p.pic img,
ul.col11.list_stylenone p.pic,
ul.col11.list_stylenone p.pic img,
ul.col11.list_stylenone p.pic,
ul.col11.list_stylenone p.pic img {
	width: 200px;
}

ul.col11.list_decimal p.pic.lc {
	width: 275px;
	margin-right: 15px;
}

ul.col11.list_stylenone p.pic.gb {
	width: 300px;
	margin-right: 15px;
}

ul.col11.list_stylenone p.pic.gb2 {
	width: 500px;
	margin-right: 15px;
}
/* --product_recall */

/* mat-pure bunner */
#btn_matp a {
	background-position: right 10px top 10px;
}

#btn_matp img {
	width: 95%;
	height: auto;
	margin: 0 auto 0 auto;
}

/* INDEX */
/* box_search */
.customer .box_search {
padding: 17px;
background: #FFF;
}
.customer .box_search p span:last-child {
width: 76px;
}
.customer .box_search input[type="text"] {
padding: 8px;
}
#customer_index .box_search input[type="text"] {
padding: 8px;
background: #F5F5F5;
}
.customer .box_search input[type="button"] {
width: 100%;
background-image: url(https://www.mandom.co.jp/common/customer/images/ico_search.svg);
background-size: 55px;
}

/* tab */
#customer_index .tab {
margin: 0;
padding-right: 20px;
padding-left: 20px;
}
#customer_index .tab ul {
table-layout: fixed;
}
#customer_index .tab ul li {
padding: 1.5rem .5rem;
font-size: 1.6rem;
}
#customer_index .tab ul li span.current:after {
bottom: -1.7rem;
}

/* faq */
#customer_index .faq {
vertical-align: top;
}
#customer_index .faq .btn_whitebox_arrow {
margin-bottom: 20px;
}
#customer_index .faq.movie .btn_whitebox_arrow {
margin-bottom: 0;
}
#customer_index .time span:first-child {
width: 18%;
}



/* Q&A */
/*list_pager*/
.list_pager a:nth-child(n+7) {
display: inline-block;
}


/* Q&A DETAIL */

.detail_qa .question {
padding-bottom: 2rem;
margin: 4rem 0 3rem;
}
.detail_qa .answer .text-img {
display: table;
width: 100%;
}
.detail_qa .answer .text-img > div,
.detail_qa .answer .text-img > figure {
display:table-cell;
vertical-align: top;
}
.detail_qa .answer .text-img > figure {
min-width: 300px;
}
.detail_qa .answer figure {
//margin: 4rem 0;
}
.detail_qa .answer .ml-20 {
margin-left: -20px;
}

#customer_detail .list_form {
padding-top: 4rem;
}

#customer_detail .list_form dt {
width: 28%;
}

.col1, .col2, .col3, .col4, .col5, .col6, .col7, .col8, .col9, .col10, .col11, .col12 {
    vertical-align: top;
}

.detail_qa .img_120-1 {
	width: 478px;
	min-height: 285px;
	margin: 1em auto;
	text-align: center;
	background: url(https://i-ask465.dga.jp/dispImage.php?id=22) no-repeat 0 20px;
	background-size: 460px;
}
.detail_qa .img_120-1 p {
	padding: 5em 0 0;
}
.detail_qa .col1, .detail_qa .col2, .detail_qa .col3, .detail_qa .col4, .detail_qa .col5, .detail_qa .col6, .detail_qa .col7, .detail_qa .col8, .detail_qa .col9, .detail_qa .col10, .detail_qa .col11, .detail_qa .col12 {
	padding: 20px; 
}
.detail_qa .col1 { width:8.3333%; }
.detail_qa .col2 { width:16.6666%; }
.detail_qa .col3 { width:25%; }
.detail_qa .col4 { width:33.3333%; }
.detail_qa .col5 { width:41.6666%; }
.detail_qa .col6 { width:50%; }
.detail_qa .col7 { width:58.333%; }
.detail_qa .col8 { width:66.666%; }
.detail_qa .col9 { width:74.999%; }
.detail_qa .col10 { width:83.333%; }
.detail_qa .col11 { width:91.666%; }
.detail_qa .col12 { width:100%; }

}/* min-width:768px */








@media screen and (min-width:960px) {

/* mat-pure bunner */
#btn_matp img {
	width: auto;
	height: 74px;
	margin: 0 auto 0 -5px;
}



}/* min-width:960px */









@media screen and (min-width:1080px) {



}/* min-width:1080px */










@media screen and (min-width:1200px) {





}/* min-width:1200px */