/* CSS Document ---------------------------------------------------------------------------------------------------------------- */ /* XHTML1.1/CSS【Type Jimdo】2009.10.24 var.1.0　(C)advista */ /* [http://www.meihoski.co.jp/] */ /* Default Style Reset --------------------------------------------------------------------------------------------------------- */ body,form,fieldset {margin: 0px;padding: 0px;} fieldset {border:none;} h1,h2,h3,h4,h5,h6,p,pre,blockquote,ul,ol,dl,dd{margin: 0px;padding: 0px;} blockquote,li,dt,dd {} li {list-style:none;} input,textarea {font-size: 1em;} img {border: 0px none; } /* Tag Castam ----------------------------------------------------------------------------------------------------------------- */ @media(min-width: 920px){ a[href^="tel:"]{ pointer-events: none; } } body { -webkit-text-size-adjust: 100%; font-size: 17px;} em { font-weight: normal;font-style: normal;} strong {} a { text-decoration: none; color: #000;} a:link {} a:visited {} a:active {} a:focus {} button { background: none; border: none; outline: none; -webkit-appearance: none; -moz-appearance: none; appearance: none;} .ma5 { margin-bottom:5px;} .ma10 { margin-bottom:10px;} .ma20 { margin-bottom:20px;} .ma30 { margin-bottom:30px;} .ma40 { margin-bottom:40px;} .ma50 { margin-bottom:50px;} .ma60 { margin-bottom:60px;} .ma70 { margin-bottom:70px;} .ma80 { margin-bottom:80px;} .pa40 { padding: 0 40px;} .flex { display: flex;} .center { text-align: center;} .end { text-align: end;} .justify { text-align: justify;} .left { text-align:left;} .bold { font-weight: bold;} .new_line { display: contents;} p { line-height:1.8rem; text-align: justify;} h1 {} h2 { font-size: 30px;}/*1.80rem;*/ h3 { font-size: 26px;}/*1.55rem;*/ h4 { font-size: 23px;}/*1.35rem;*/ hr { width: 100%;} .sp { display: none;} .w100 { width: 100%;} header { width: 100vw; margin: 0 calc(50% - 50vw); background-color: #ffffff;} #header { display:flex; justify-content: space-between; max-width: 1200px; margin: 0 auto; padding:10px; align-items: center;} #top { background:url(../img/top/top_image.jpg); background-repeat:no-repeat; background-size:cover; margin-bottom:4px; height:1053px; text-align:center;/* max-width: 1200px;*/ margin:auto;} #top .topbox { padding:60px 0;} #top .title { font-size:34px; font-weight:bold; color:#fff;} #top .img { padding:40px 0;} #top .big { font-size:24px; color:#00478a; font-weight:bold; line-height: 2.4rem; padding-top:80px;} .img { text-align:center;} .img .imgbox { width:100%;} #cont01 .contbox,#cont02 .contbox { max-width:1280px;/*max-width:1100px;*/} #cont01 .contbox { margin:145px auto;} #cont01 .contbox .img { text-align:center;} #cont01 .contbox ul { display:flex; justify-content:center;} #cont01 .contbox li { margin:auto;} #cont02 { background:url(../img/top/cont02_image.jpg); /*height:1040px;*/ /*max-width:1200px; margin:auto;*/ width: 100vw; padding-bottom: 40px;} #cont02 .contbox { margin:auto;} #cont02 .contbox .subtitle { position:relative; top:-44px; text-align:center;} #cont02 h3 { text-align:center; color:#00478a; letter-spacing: 0.12rem; font-size:21px;} #cont02 h4 { color:#00478a; margin-bottom:15px; height:48px;} #cont02 .contbox ul { display:flex; justify-content:space-between;} #cont02 .box .imgbox { display:flex; justify-content:center; padding-bottom:23px; min-height:400px; align-items:/*flex-end*/ center;} #cont02 .contbox .box dl { max-width:280px; display:flex; margin: auto;} #cont02 .contbox .box dt { min-width:70px;} #cont02 .contbox .box dd {} #cont02 .contbox .box dd span { font-size:10px;} /* ワンダークロス ----------------------------------------------------------------------------------------------------------------- */ #wondercloth { max-width:1280px; margin: 0 auto;} #wondercloth h6 { font-size: 1.18rem; font-weight: bold; color:#E61673 ; margin-bottom: 8px;} #wondercloth p.lead { font-size: 1.2rem; } #cont11 .contbox { max-width:760px; margin: 0 auto; padding: 60px 0;} #cont12 .contbox { max-width:760px; margin: 0 auto; margin-top: 50px;} #cont13 .contbox { max-width:1200px; margin: 0 auto;} #cont14 .contbox { max-width:1200px; margin: 0 auto;} #cont15 .contbox { max-width:980px; margin: 0 auto;} #cont16 .contbox { max-width:760px; margin: 0 auto;} #cont17 .contbox { max-width:980px; margin: 0 auto;} #cont18 .contbox { max-width:980px; margin: 0 auto;} #cont19 .contbox { max-width:980px; margin: 0 auto;} #cont20 .contbox { max-width:760px; margin: 0 auto; margin-top: 50px;} #cont21 .contbox { max-width:1200px; margin: 0 auto;} #cont22 .contbox { max-width:980px; margin: 0 auto;} .contbox img { width: 100%; height: auto;} .contbox ul.goods { justify-content: space-between; align-items: center;} .contbox ul.goods li { width: calc((100% / 2) - 50px);} .contbox ul.shopping { justify-content: space-between; align-items: center;} .contbox ul.shopping li { width: calc((100% / 3) - 30px);} #cont17 h3 img.numb { width: 98px; height: auto; display: block; padding-bottom: 0.25em;} #cont18 h3 img.numb, #cont19 h3 img.numb { width: 98px; height: auto; display: block; padding-bottom: 1.6em;} #cont17 h3, #cont18 h3, #cont19 h3 { font-size:3.5rem; line-height: 4.5rem; color: #E61673; align-items: center;} #cont17 p, #cont18 p, #cont19 p { font-size: 3rem; line-height: 4rem; font-weight: bold; padding-left: 2em;} #cont11 { width: 100vw; margin: 0 calc(50% - 50vw);} #cont11.relative { position: relative; overflow: hidden;} #cont11 img.topback { position: absolute; top: 0; left: 0; width: 100vw; height: 100%; object-fit: cover; z-index: -1;} #sec02 { width: 100vw; margin: 0 calc(50% - 50vw); padding: 60px 0;} #sec02.relative { position: relative; overflow: hidden;} #sec02 img.sec02back { position: absolute; top: 0; left: 0; width: 100vw; height: 100%; object-fit: cover; z-index: -1;} footer a { text-decoration:none; color:#595757;} footer ul { display: flex; justify-content: space-between; margin: 0 auto; max-width: 1100px; padding: 40px 0; align-items: flex-end;} .slider img1 { backface-visibility: hidden; } .original-button { display: flex; align-items: center; justify-content: center; line-height: 1; text-decoration: none; color: #ffffff; font-size: 18px; border-radius: 5px; width: 230px; height: 40px; font-weight: bold; border-bottom: 4px solid #177e9e; transition: 0.3s; box-shadow: 0px 3px 5px 0px rgba(0, 0, 0, 0.4); background-color: #03a9f4; margin-bottom:18px; } .original-button:hover { box-shadow: 0 0 rgba(0, 0, 0, 0.4); border-bottom-width: 2px; transform: translateY(2px); } @media (hover: hover) { a:hover { opacity:0.75; transition:.3s;} } @media (hover: none) { a:active { opacity:0.75; transition:.3s;} } @media only screen and (max-width: 1380px) { } @media only screen and (max-width: 1280px) { #header { padding: 0 20px; gap: 100px;} #footbox { padding: 0 20px;} } @media only screen and (max-width: 1024px) { } @media only screen and (max-width: 768px) { .pc { display:none;} .sp { display:block;} #header img { width: 100%; height: auto;} #cont11 .contbox { padding: 60px 20px;} #cont12 .contbox { padding: 0 20px;} #cont13 .contbox { } #cont14 .contbox { } #cont15 .contbox { padding: 0 20px;} #cont16 .contbox { padding: 0 20px;} #cont17 .contbox { padding: 0 20px;} #cont18 .contbox { padding: 0 20px;} #cont19 .contbox { padding: 0 20px;} #cont20 .contbox { padding: 0 20px;} #cont21 .contbox { } #cont22 .contbox { padding: 0 20px;} .contbox ul.goods li { width: calc((100% / 2) - 20px);} .contbox ul.shopping li { width: calc((100% / 3) - 15px);} #cont17 h3 img.numb, #cont18 h3 img.numb, #cont19 h3 img.numb { padding-bottom: 0px;} #cont17 h3, #cont18 h3, #cont19 h3 { font-size: 2.7rem; line-height: 3.7rem; flex-direction: column; align-items: flex-start;} #cont17 p, #cont18 p, #cont19 p { font-size: 2.3rem; line-height: 3.3rem; padding-left: 0em;} footer { display: flex; justify-content: center;} #footbox { padding: 40px 20px; gap: 30px; flex-direction: column; align-items: center;} #footbox .company { flex-direction: column;} #footbox .text { } #footbox img { width: 100%; height: auto;} } @media only screen and (max-width: 428px) { body { font-size: 15px;} .contbox ul.goods { flex-direction: column;} .contbox ul.goods li { width: 100%; height: auto; display: block; margin-bottom: 40px;} .contbox ul.shopping li { width: calc((100% / 3) - 8px);} #cont17 h3 img.numb, #cont18 h3 img.numb, #cont19 h3 img.numb { width: 78px; height: auto;} #cont17 h3, #cont18 h3, #cont19 h3 { font-size: 2.1rem; line-height: 3.1rem;} #cont17 p, #cont18 p, #cont19 p { font-size: 1.6rem; line-height: 2.6rem;} #cont22 .contbox p.attention { line-height: 1.5rem;} } @media only screen and (max-width: 375px) { #cont17 h3 img.numb, #cont18 h3 img.numb, #cont19 h3 img.numb { width: 59px; height: auto;} #cont17 h3, #cont18 h3, #cont19 h3 { font-size: 2.0rem; line-height: 3.0rem;} #cont17 p, #cont18 p, #cont19 p { font-size: 1.5rem; line-height: 2.5rem;} }