@charset "utf-8";

/* NEW HEADER / FOOTER - 2020 */

/* wrap_search_form_v2 */
.wrap_search_form_v2 {
position: fixed;
top:0;
left:0;
background:#FFF;
z-index: 1000;
width: 0;
height: 0;
padding-top:8px;
padding-left: 80px;
text-align: center;
box-sizing: border-box;
opacity: 0;
transition: .3s;
margin-top: -50px;
border-bottom: 1px solid #e0e0e0;
}
.wrap_search_form_v2.active {
opacity: 1;
margin-top: 0;
padding: 10px 10px 0 65px;
width: 100%;
height: 55px;
box-sizing: border-box;
}
.wrap_search_form_v2 form {
width: 100%;
text-align: center;
box-sizing: border-box;
}
.wrap_search_form_v2 input[type="text"] {
width: calc(100% - 50px);
height: 30px;
border:1px solid #0099A8;
background: #FFF;
font-size: 1.5rem;
}
.wrap_search_form_v2 input[type="image"] {
display: inline-block;
margin-left: 5px;
vertical-align: middle;
width: 22px;
height: 22px;
}

/*sp_header*/
.sp_header.v2 #btn_header_search {
position: relative;
top:5px;
display: inline-block;
width: 22px;
height: 22px;
background:url(https://www.mandom.co.jp/common/images/common/header_ico_search.svg) 50% 50%;
background-size: cover;
}
.sp_header.v2 {
padding-top: 3px;
height: 47px;
}
.sp_header.v2 h1 {
position: relative;
width: 40px;
padding-left: 10px;
margin-left: 10px;
}
.sp_header.v2 h1:before {
position: absolute;
top:8px;
left:0;
content: "";
display: inline-block;
width: 1px;
height: 25px;
background: #e0e0e0;
vertical-align: middle;
}
.sp_header.v2 h1 a {
height: 30px;
}


/* hmenu-nav */
.hmenu-nav.v2 li#index {
border-top: 1px solid #AAD9DD;
padding-left: 30%;
}
.hmenu-nav.v2 dl {
border-top: 1px solid #AAD9DD;
letter-spacing: -0.5em;
}
.hmenu-nav.v2 dt,
.hmenu-nav.v2 dd {
display: inline-block;
vertical-align: top;
letter-spacing: normal;
box-sizing: border-box;
}
.hmenu-nav.v2 dt {
padding: .7rem 0 0 20px;
width: 30%;
}
.hmenu-nav.v2 dd {
width: 70%;
}
.hmenu-nav.v2 dt a {
color: #888DA8;
font-size: 93.3%;
font-weight: 600;
}
.hmenu-nav.v2 li a {
text-align: left;
}
.hmenu-nav.v2 li:first-child {
border-top: none;
}
.hmenu-nav.v2 li:last-child {
border-bottom: none;
}

/*hmenu_search-box*/
.hmenu_search-box {
background: #e5f4f5;
padding: 15px 20px 20px;
text-align: center;
}
.hmenu-nav.v2 .hmenu_search-box .language {
margin-bottom: 1rem;
text-align: center;
}
.hmenu-nav.v2 .hmenu_search-box .language a {
display: inline-block;
color: #333;
font-size: 93.3%;
}
.hmenu-nav.v2 .hmenu_search-box .language a.current {
color: #CCC;
pointer-events: none;
}
.hmenu-nav.v2 .hmenu_search-box form {
text-align: center;
}
.hmenu-nav.v2 .hmenu_search-box input[type="text"] {
width: calc(100% - 50px);
height: 30px;
border:1px solid #0099A8;
background: #FFF;
font-size: 1.5rem;
}
.hmenu-nav.v2 .hmenu_search-box input[type="image"] {
display: inline-block;
margin-left: 5px;
vertical-align: middle;
width: 22px;
height: 22px;
}


/* HEADER */
.header_v2 {
display: none;
background:#FFF;
box-shadow: 0 1px 2px rgba(0,0,0,.1);
position: fixed;
padding: 5px 0;
z-index: 109;
}
.header_v2:before {
position: absolute;
top:-15px;
left:-5px;
content: "";
display: block;
width: 0;
height: 0;
border-right: 20px solid #0099A8;
border-top: 20px solid transparent;
border-bottom: 20px solid transparent;
transform: rotate(45deg);
}
.header_v2 .gnav {
text-align: center;
padding: 10px 15px 0;
min-height: 40px;
box-sizing: border-box;
}
.header_v2 .gnav ul{
display: table;
letter-spacing: normal;
}
.header_v2 .gnav ul li{
display: table-cell;
padding: 0 5px;
white-space: nowrap;
font-size: 1.2rem;
}
.header_v2 .gnav ul li#customer {
border-right: 1px solid #e0e0e0;
}
.header_v2 .gnav ul li.current a{
font-weight: 600;
color: #0099A8;
}
.header_v2 .gnav ul li.search input {
display: inline-block;
vertical-align: middle;
}
.header_v2 .gnav ul li.search input[type=text] {
margin-right: 5px;
width: 90px;
border:1px solid #0099a8;
background:#FFF;
height: 20px;
}
.header_v2 .gnav ul li.language {
padding-left: .6rem;
}
.header_v2 .gnav ul li.language a {
color: #333;
}
.header_v2 .gnav ul li.language a.current {
color: #CCC;
pointer-events: none;
}
.header_v2 h1 {
position: absolute;
top:30%;
right:10px;
}
.header_v2 h1 a {
display: block;
background: url(https://www.mandom.co.jp/common/images/common/mandom_logo.svg) no-repeat 0 0;
background-size: 100%;
width: 36px;
height: 33px;
text-indent: -9999px;
}

.header_v2 + .category_title.lower {
top:51px;
}


/* FOOTER */
.footer_v2 {
position: relative;
background: #FFF;
font-size: 1.2rem;
}
.footer_v2 .wrap_mailmagazine {
background:transparent;
margin: 0;
padding: 0;
height: 0;
}
.footer_v2 .wrap {
position: relative;
width: 100%;
margin: 0 auto;
}
.footer_v2 .wrap_select_lang {
}
.footer_v2 .wrap_select_lang ul {
padding: 5px 5px 0;
text-align: center;
}
.footer_v2 .wrap_select_lang li {
display: inline-block;
padding: .5rem 1rem;
}
.footer_v2 .wrap_select_lang li a.current {
color: #adadad;
}
.footer_v2 .wrap_select_lang ul li.language a.current {
color: #CCC;
pointer-events: none;
}

.footer_v2 .footer_v2_container {
position: relative;
margin: 0 10px;
padding: 0;
}
.footer_v2 .footer_v2_container .wrap {
position: relative;
}
.footer_v2 .footer_v2_container .menu {
border-bottom: 1px solid #CCC;
letter-spacing: -0.5em;
}
.footer_v2 .footer_v2_container .menu li {
display: inline-block;
margin: 0;
padding: 5px 0;
vertical-align: top;
letter-spacing: normal;
width: 46%;
box-sizing: border-box;
border-top: 1px solid #CCC;
}
.footer_v2 .footer_v2_container .menu li:nth-child(even) {
width: 54%;
}
.footer_v2 .footer_v2_container .menu li a {
position: relative;
display: block;
padding: 6px 6px 6px 18px;
}
.footer_v2 .footer_v2_container .menu li:nth-child(even) a {
border-left: 1px solid #CCC;
}
.footer_v2.ir .footer_v2_container .menu li,
.footer_v2.ir .footer_v2_container .menu li:nth-child(even) {
width: 46%;
}
.footer_v2.ir .footer_v2_container .menu li:nth-child(2),
.footer_v2.ir .footer_v2_container .menu li:nth-child(4),
.footer_v2.ir .footer_v2_container .menu li:nth-child(7),
.footer_v2.ir .footer_v2_container .menu li:nth-child(9) {
width: 54%;
	}
.footer_v2.ir .footer_v2_container .menu li:nth-child(10) {
width: 100%;
}
.footer_v2.ir .footer_v2_container .menu li:nth-child(even) a {
border-left: none;
}
.footer_v2.ir .footer_v2_container .menu li:nth-child(2) a,
.footer_v2.ir .footer_v2_container .menu li:nth-child(4) a,
.footer_v2.ir .footer_v2_container .menu li:nth-child(7) a,
.footer_v2.ir .footer_v2_container .menu li:nth-child(9) a {
border-left: 1px solid #CCC;
}
.footer_v2 .footer_v2_container .menu li a:before {
position: absolute;
top:12px;
left:3px;
content: "";
display: block;
width: 6px;
height: 6px;
border-top:2px solid #0099a8;
border-right:2px solid #0099a8;
transform: rotate(45deg);
}
.footer_v2 h1 {
padding: 25px 10px;
}
.footer_v2 .copyright {
position: relative;
padding: 10px;
border-top: 1px solid #CCC;
color: #4D4D4D;
font-size: 10px;
font-weight: 600;
} 
.footer_v2 .copyright .col12 {
padding: 0;
text-align: right;
}
.footer_v2 .mailmagazine {
position: absolute;
bottom:-30px;
left:0;
z-index: 50;
}
.footer_v2 .mailmagazine a {
text-decoration: underline;
}

.footer_v2 h1 {
padding: 25px 10px;
}

.customer .footer_v2 .wrap_select_lang li.language a.current {
border-right: 1px solid #744374;
margin-right: 6px;
padding-right: 6px;
float: left
}





/*footer_v2-top-btn*/
.footer_v2-top-btn {
position: absolute;
top:-31px;
right:20px;
display: block;
width: 113px;
height: 31px;
background: #FFF;
border-top-right-radius: 4px;
border-top-left-radius: 4px;
letter-spacing: normal;
color: #0099a8;
font-size: 11px;
font-weight: 600;
text-align: center;
transition: all .3s;
}
.footer_v2-top-btn span {
position: relative;
display: inline-block;
padding-top: 8px;
padding-left: 18px;
}
.footer_v2-top-btn:before,
.footer_v2-top-btn:after {
content: "";
position: absolute;
top:12px;
left:16px;
display: inline-block;
width: 7px;
height: 7px;
border-left: 1px solid #0099a8;
border-top: 1px solid #0099a8;
transform: rotate(45deg);
}
.footer_v2-top-btn:after {
top:16px;
}
.footer_v2-top-btn:visited {
color: #0099a8;
}
.footer_v2-top-btn:hover {
opacity: 1;
color: #66c2cb;
}
.footer_v2-top-btn:hover:before,
.footer_v2-top-btn:hover:after {
border-color: #66c2cb;
}









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

/* HEADER */
.header_v2 {
display: block;
}

.header_v2 + .category_title.lower {
top:56px;
}

/* FOOTER */
.footer_v2 h1 {
float: left;
padding: 30px 0 0;
width: 8%;
text-align: right;
box-sizing: border-box;
}
.footer_v2 .footer_v2_container {
margin: 0;
border-top: 1px solid #CCC;
}
.footer_v2 .wrap {
overflow: hidden;
}
.footer_v2 .footer_v2_container .menu {
float: right;
position: relative;
width: calc(92% - 140px);
padding: 20px 10px;
margin-right: 140px;
border-bottom: none;
box-sizing: border-box;
}
.footer_v2 .footer_v2_container .menu li,
.footer_v2 .footer_v2_container .menu li:nth-child(even) {
/*width: auto;*/
border-top: none;
padding: 0;
}
.footer_v2 .footer_v2_container .menu li:nth-child(even) a {
border-left: none;
}
.footer_v2 .footer_v2_container .menu:after {
position: absolute;
top:50%;
transform: translateY(-50%);
right:0;
content: "";
display: inline-block;
width: 1px;
height: 70%;
vertical-align: middle;
background: #CCC;
}
.footer_v2.ir .footer_v2_container .menu {
width: 92%;
margin-right: 0;
}
.footer_v2.ir .footer_v2_container .menu:after {
display: none;
}
.footer_v2 .footer_v2_container .menu li,
.footer_v2 .footer_v2_container .menu li:nth-child(even) {
width: 28%;
}
.footer_v2 .footer_v2_container .menu li:nth-child(1),
.footer_v2 .footer_v2_container .menu li:nth-child(5) {
width: 20%;
}
.footer_v2 .footer_v2_container .menu li:nth-child(2),
.footer_v2 .footer_v2_container .menu li:nth-child(6){
width: 24%;
}
/* ir */

.footer_v2.ir .footer_v2_container .menu {
/*width: 94%;*/
}

.footer_v2.ir .footer_v2_container .menu li,
.footer_v2.ir .footer_v2_container .menu li:nth-child(even),
.footer_v2.ir .footer_v2_container .menu li:nth-child(1),
.footer_v2.ir .footer_v2_container .menu li:nth-child(2),
.footer_v2.ir .footer_v2_container .menu li:nth-child(3),
.footer_v2.ir .footer_v2_container .menu li:nth-child(4),
.footer_v2.ir .footer_v2_container .menu li:nth-child(5),
.footer_v2.ir .footer_v2_container .menu li:nth-child(6),
.footer_v2.ir .footer_v2_container .menu li:nth-child(7),
.footer_v2.ir .footer_v2_container .menu li:nth-child(8),
.footer_v2.ir .footer_v2_container .menu li:nth-child(9),
.footer_v2.ir .footer_v2_container .menu li:nth-child(10) {
width: 20%;
}
.footer_v2.ir .footer_v2_container .menu li:nth-child(1),
.footer_v2.ir .footer_v2_container .menu li:nth-child(6) {
width: 14%;
}
.footer_v2.ir .footer_v2_container .menu li:nth-child(2),
.footer_v2.ir .footer_v2_container .menu li:nth-child(7) {
width: 16%;
}
.footer_v2.ir .footer_v2_container .menu li:nth-child(3),
.footer_v2.ir .footer_v2_container .menu li:nth-child(8) {
width: 20%;
}
.footer_v2.ir .footer_v2_container .menu li:nth-child(4),
.footer_v2.ir .footer_v2_container .menu li:nth-child(9) {
width: 22%;
}
.footer_v2.ir .footer_v2_container .menu li:nth-child(5),
.footer_v2.ir .footer_v2_container .menu li:nth-child(10) {
width: 25%;
}
.footer_v2.ir .footer_v2_container .menu li:nth-child(2) a,
.footer_v2.ir .footer_v2_container .menu li:nth-child(4) a,
.footer_v2.ir .footer_v2_container .menu li:nth-child(7) a,
.footer_v2.ir .footer_v2_container .menu li:nth-child(9) a {
border-left: none;
}

.footer_v2 .copyright {
border-top: none;
}
.footer_v2 .copyright .col12 {
text-align: left;
}
.footer_v2 .mailmagazine {
bottom:auto;
left:calc(100% - 130px);
top: 38%;
width: 130px;
}
.footer_v2.ir .mailmagazine {
display: none;
}

.footer_v2-top-btn {
right:40px;
}





}/* min-width:768px */





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

/* HEADER */
.header_v2 {
padding: 10px 0;
}
.header_v2:before {
border-width: 32px;
top:-20px;
}
.header_v2 h1 a {
width: 42px;
}
.header_v2 .gnav {
padding: 8px 10px 0;
}
.header_v2 .gnav ul li{
padding: 0 13px;
font-size: 1.5rem;
}
.header_v2 .gnav ul li.language {
padding-left:2rem;
}
.header_v2 .gnav ul li.search input[type=text] {
width: 145px;
}




/* FOOTER */
.footer_v2 {
font-size: 1.3rem;
}

.footer_v2 .wrap {
max-width: 1080px;
width: 1080px;
margin: 0 auto;
}

.footer_v2 h1 {
width: 6%;
text-align: center;
}
.footer_v2 .footer_v2_container .menu {
width: calc(90% - 200px);
margin-right: 200px;
}
.footer_v2.ir .footer_v2_container .menu {
width: 94%;
margin-right: 0;
}
.footer_v2 .footer_v2_container .menu li,
.footer_v2 .footer_v2_container .menu li:nth-child(even) {
width: 21%;
}
.footer_v2 .footer_v2_container .menu li:nth-child(1),
.footer_v2 .footer_v2_container .menu li:nth-child(5){
width: 17%;
}
.footer_v2 .footer_v2_container .menu li:nth-child(3),
.footer_v2 .footer_v2_container .menu li:nth-child(7){
width: 25%;
}
.footer_v2 .footer_v2_container .menu li:nth-child(4),
.footer_v2 .footer_v2_container .menu li:nth-child(8){
width: 28%;
}

.footer_v2 .mailmagazine {
left:calc(100% - 180px);
width: 180px;
text-align: center;
}
.footer_v2-top-btn {
right:20px;
}


}/*min-width:1080px*/






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

.footer_v2 h1 {
width: 10%;
}
.footer_v2.ir .footer_v2_container .menu {
width: 90%;
}




}/*min-width:1120px*/





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

.header_v2 .gnav ul li.language {
padding-left:4rem;
}



}