@charset "utf-8"; /*--------------------------------------------- Reset Style ---------------------------------------------*/ html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, dl, dt, dd, ol, ul, li, fieldset, form, label, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; vertical-align: baseline; background: transparent; } * { box-sizing: border-box; margin: 0; padding: 0; font-size: 100%; } html { color: #333; background-color: #fff; font-size: 62.5%; overflow: auto; } body { width: 100%; height: 100%; font-family: Meiryo, メイリオ, 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', Osaka, 'MS PGothic', arial, helvetica, sans-serif; font-size: 1rem; line-height: 1.5; text-align: left; } hr, legend { display: none; } img { border: none; vertical-align: bottom; } article, aside, details, figure, figcaption, header, footer, hgroup, menu, nav, section, main { display: block; } div, dl, dt, dd, form, input, ul, ol, li, p, select, textarea, span, th, td, figure, figcaption { margin: 0; padding: 0; } h1, h2, h3, h4, h5, h6, address, th, caption, em, strong, dfn { font-style: normal; font-weight: normal; } input, select { vertical-align: middle; } input, select, textarea { font-size: 100%; font-family: inherit; font-weight: inherit; } sup { vertical-align: top; font-size: 72%; } sub { vertical-align: bottom; font-size: 72%; } del { text-decoration: line-through; } ol, ul { list-style: none; } table { border-collapse: collapse; border-spacing: 0; font-size: 100%; font-size: inherit; } caption { text-align: left; } fieldset{ border: 0; } blockquote, q { quotes: none; } blockquote:before, blockquote:after, q:before, q:after { content:''; content: none; } a { color: #333; outline: none; text-decoration: none; transition: all .3s; } a:hover { /*text-decoration: underline;*/ opacity: .6; } /*--------------------------------------------- Common Style ---------------------------------------------*/ .m0 { margin: 0 !important; } .mat0 { margin-top: 0 !important; } .mat1 { margin-top: 1em !important; } .mat5 { margin-top: 5px !important; } .mat10 { margin-top: 10px !important; } .mat15 { margin-top: 15px !important; } .mat20 { margin-top: 20px !important; } .mat25 { margin-top: 25px !important; } .mat30 { margin-top: 30px !important; } .mat40 { margin-top: 40px !important; } .mat50 { margin-top: 50px !important; } .mab0 { margin-bottom: 0 !important; } .mab1 { margin-bottom: 1em !important; } .mab5 { margin-bottom: 5px !important; } .mab10 { margin-bottom: 10px !important; } .mab15 { margin-bottom: 15px !important; } .mab20 { margin-bottom: 20px !important; } .mab25 { margin-bottom: 25px !important; } .mab30 { margin-bottom: 30px !important; } .mab40 { margin-bottom: 40px !important; } .mab50 { margin-bottom: 50px !important; } .mar0 { margin-right: 0 !important; } .mar1 { margin-right: 1em !important; } .mar10 { margin-right: 10px !important; } .mar15 { margin-right: 15px !important; } .mar20 { margin-right: 20px !important; } .mar30 { margin-right: 30px !important; } .mal0 { margin-left: 0 !important; } .mal1 { margin-left: 1em !important; } .mal10 { margin-left: 10px !important; } .mal15 { margin-left: 15px !important; } .mal20 { margin-left: 20px !important; } .mal30 { margin-left: 30px !important; } .p0 { padding: 0 !important; } .pat0 { padding-top: 0 !important; } .pat1 { padding-top: 1em !important; } .pat5 { padding-top: 5px !important; } .pat10 { padding-top: 10px !important; } .pat15 { padding-top: 15px !important; } .pat20 { padding-top: 20px !important; } .pat25 { padding-top: 25px !important; } .pat30 { padding-top: 30px !important; } .pat40 { padding-top: 40px !important; } .pat50 { padding-top: 50px !important; } .pab0 { padding-bottom: 0 !important; } .pab1 { padding-bottom: 1em !important; } .pab5 { padding-bottom: 5px !important; } .pab10 { padding-bottom: 10px !important; } .pab15 { padding-bottom: 15px !important; } .pab20 { padding-bottom: 20px !important; } .pab25 { padding-bottom: 25px !important; } .pab30 { padding-bottom: 30px !important; } .pab40 { padding-bottom: 40px !important; } .pab50 { padding-bottom: 50px !important; } .par0 { padding-right: 0 !important; } .par1 { padding-right: 1em !important; } .par10 { padding-right: 10px !important; } .par15 { padding-right: 15px !important; } .par20 { padding-right: 20px !important; } .par30 { padding-right: 30px !important; } .pal0 { padding-left: 0 !important; } .pal1 { padding-left: 1em !important; } .pal10 { padding-left: 10px !important; } .pal15 { padding-left: 15px !important; } .pal20 { padding-left: 20px !important; } .pal30 { padding-left: 30px !important; } .fl { float: left !important; } .fr { float: right !important; } .tal { text-align: left !important; } .tac { text-align: center !important; } .tar { text-align: right !important; } .fw { font-weight: bold !important; } .fwn { font-weight: normal !important; } /*--------------------------------------------- Original Style master ----------------------------------------------- Suggested propaty order: { box-sizing, content, display, position, top, right, bottom, left, z-index, float, clear, min-width, min-height, max-width, max-height, width, height, margin, padding, border, background, color, font-family, font-size, font-weight, text-align, text-decoration, text-indent, line-height, letter-spacing, vertical-align, visibility, white-space, cursor, opacity, transform, transition, overflow, and other propaty } ----------------------------------------------- 01. layout 02. footer 03. clearfix ---------------------------------------------*/ /*--------------------------------------------- 01. layout ---------------------------------------------*/ * { box-sizing: border-box; } html { -webkit-text-size-adjust: 100%; } body { font-size: 1.4rem; } strong{ font-weight: bold; } main { min-width: 1320px; padding: 60px 0 80px; overflow-x: hidden; } .inner{ width: 1280px; margin: 0 auto; } .pc { display: block; } .sp { display: none; } img.pc{ display: inline-block; } img.sp{ display: none; } .mainContent { background: url(/assets/images/bg_sewcoworld.png) repeat-y center 0; } .ttl { margin-bottom: 25px; color: #614304; font-family: 'Noto Serif JP', serif; font-size: 2.4rem; font-weight: 400; text-align: center; } .ttl-decoration { margin-bottom: 25px; padding-bottom: 16px; background: url(/assets/images/i_decoration.png) no-repeat center bottom; color: #614304; font-family: 'Noto Serif JP', serif; font-size: 2.4rem; font-weight: 400; text-align: center; } @media (max-width: 767px) { main { min-width: initial; min-width: auto; padding: 40px 0 60px; } .inner { width: auto; padding: 0 20px; } .pc { display: none; } .sp { display: block; } img.pc { display: none; } img.sp { display: inline-block; } .mainContent { background-image: url(/assets/images/bg_sewcoworld_sp.png); /*background-size: cover;*/ } /*スマホ時メニューを開いたときに背景コンテンツ固定*/ .scroll-prevent { position: fixed; z-index: -1; width: 100%; height: 100%; } } /*--------------------------------------------- 02. footer ---------------------------------------------*/ footer { padding-bottom: 40px; } footer .us-title { margin-bottom: 25px; color: #614304; font-family: 'Noto Serif JP', serif; font-size: 1.8rem; font-weight: 400; } footer .us-menu { font-family: 'Noto Serif JP', serif; font-size: 1.8rem; font-weight: 400; } footer .us-menu ul:after { content: ""; display: block; clear: both; height: 0; } footer .us-menu li { float: left; width: 408px; margin: 20px 28px 0 0; } footer .us-menu li:nth-child(1), footer .us-menu li:nth-child(2), footer .us-menu li:nth-child(3) { margin-top: 0; } footer .us-menu li:nth-child(3n) { margin-right: 0; } footer .us-menu li a { display: block; height: 72px; padding: 0 20px; border: 1px solid #efece5; line-height: 64px; } footer .us-menu li a i { margin-right: 20px; } footer .us-menu li a i img { vertical-align: middle; } @media (max-width: 767px) { footer .us-menu li { float: none; width: auto; margin: 20px 0 0; } footer .us-menu li:nth-child(2), footer .us-menu li:nth-child(3) { margin-top: 20px; } footer .us-menu li a { padding: 0 10px; } footer .us-menu li a i { margin-right: 15px; } } /*--------------------------------------------- 03. clearfix ---------------------------------------------*/ .clearfix:after, header:after, footer:after { content: ""; display: block; clear: both; height: 0; }