/* CSS Document */ /*----- last up date 202312 -----*/ @import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100..900&display=swap'); @font-face { font-family: "logotypejp_mp_m"; src: url("https://tescom-kagawa.com/site/wp-content/themes/tescom/assets/fonts/logotypejp_mp_m.woff") format("woff"); } @font-face { font-family: "logotypejp_mp"; src: url("https://tescom-kagawa.com/site/wp-content/themes/tescom/assets/fonts/logotypejp_mp.woff") format("woff"); } /*---==============================---*/ /*---======= ベース部分構成 =======---*/ /*---==============================---*/ body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td { margin: 0; padding: 0; border: 0; outline: 0; text-decoration: none; list-style: none; font-family:"Noto Sans JP", sans-serif; font-size: 3rem; color: #000; letter-spacing: 0.2rem; } body { overflow-x: hidden; width: 100%; margin: 0; padding: 0; line-height: 1.5; } body h1, body h2, body h3, body h4, body p { transform: rotate(0.05deg); } body ul, body ol, body ul li, body ol li{list-style:none;} .cf{zoom:1;} .cf:after{content: ""; clear:both; display:block;} .c{clear:both;} *:focus {outline: none;} *:before,*:after{display:inline-block;} *.bB > *{box-sizing:border-box;} *{box-sizing:border-box;} *:focus {outline: none;} *:before,*:after{display:inline-block;} *.bB > *{box-sizing:border-box;} *.nb{border:none !important;} *.sP{text-indent:-9999px; background:no-repeat center center; background-size:100%;} *.fe{display:flex; justify-content:space-evenly; flex-wrap: wrap;} *.fe.feL{justify-content:flex-start;} *.fe.feR{flex-direction:row-reverse;} *.fe.feA{justify-content:space-between;} *.iB{letter-spacing:-1em; word-spacing: -1em;} :root *.iB{font-size: 1px; word-spacing: -1px;} *.iB > *{display:inline-block; letter-spacing:normal; vertical-align:top; font-size:100%; word-spacing:normal; font-size:13px;} article{width:100%;} .to, .to * {text-orientation: upright; writing-mode: vertical-rl;} img{width:100%; height:auto; vertical-align:bottom;} figure{margin:0;} /*margin*/ .mT00{margin-top: 0rem!important;} .mT05{margin-top: 0.5rem!important;} .mT10{margin-top: 1.0rem!important;} .mT15{margin-top: 1.5rem!important;} .mT20{margin-top: 2.0rem!important;} .mT25{margin-top: 2.5rem!important;} .mT30{margin-top: 3.0rem!important;} .mT35{margin-top: 3.5rem!important;} .mT40{margin-top: 4.0rem!important;} .mT45{margin-top: 4.5rem!important;} .mT50{margin-top: 5.0rem!important;} .mT55{margin-top: 5.5rem!important;} .mT60{margin-top: 6.0rem!important;} .mT65{margin-top: 6.5rem!important;} .mT70{margin-top: 7.0rem!important;} .mB00{margin-bottom: 0rem!important;} .mB05{margin-bottom: 0.5rem!important;} .mB10{margin-bottom: 1.0rem!important;} .mB15{margin-bottom: 1.5rem!important;} .mB20{margin-bottom: 2.0rem!important;} .mB25{margin-bottom: 2.5rem!important;} .mB30{margin-bottom: 3.0rem!important;} .mB35{margin-bottom: 3.5rem!important;} .mB40{margin-bottom: 4.0rem!important;} .mB45{margin-bottom: 4.5rem!important;} .mB50{margin-bottom: 5.0rem!important;} .mB55{margin-bottom: 5.5rem!important;} .mB60{margin-bottom: 6.0rem!important;} .mB65{margin-bottom: 6.5rem!important;} .mB70{margin-bottom: 7.0rem!important;} .mL00{margin-left: 0rem!important;} .mL05{margin-left: 0.5rem!important;} .mL10{margin-left: 1.0rem!important;} .mL15{margin-left: 1.5rem!important;} .mL20{margin-left: 2.0rem!important;} .mL25{margin-left: 2.5rem!important;} .mL30{margin-left: 3.0rem!important;} .mL35{margin-left: 3.5rem!important;} .mL40{margin-left: 4.0rem!important;} .mL45{margin-left: 4.5rem!important;} .mL50{margin-left: 5.0rem!important;} .mL55{margin-left: 5.5rem!important;} .mL60{margin-left: 6.0rem!important;} .mL65{margin-left: 6.5rem!important;} .mL70{margin-left: 7.0rem!important;} .mR00{margin-right: 0rem!important;} .mR05{margin-right: 0.5rem!important;} .mR10{margin-right: 1.0rem!important;} .mR15{margin-right: 1.5rem!important;} .mR20{margin-right: 2.0rem!important;} .mR25{margin-right: 2.5rem!important;} .mR30{margin-right: 3.0rem!important;} .mR35{margin-right: 3.5rem!important;} .mR40{margin-right: 4.0rem!important;} .mR45{margin-right: 4.5rem!important;} .mR50{margin-right: 5.0rem!important;} .mR55{margin-right: 5.5rem!important;} .mR60{margin-right: 6.0rem!important;} .mR65{margin-right: 6.5rem!important;} .mR70{margin-right: 7.0rem!important;} *.tt, *.tt *{ -webkit-transition: .3s ease all; -moz-transition: .3s ease all; -o-transition: .3s ease all; transition: .3s ease all; transition-duration: 0.3s; } *.ttx2, *.ttx2 *{ -webkit-transition: .8s ease all; -moz-transition: .8s ease all; -o-transition: .8s ease all; transition: .8s ease all; transition-duration: 0.8s; } /*--- ふんわり出現 ---*/ #content .content-area section h2, #content .content-area section h3, #content .content-area section h4, #content .content-area section p, #content .content-area section table tr > *{ transform: translate(0 , 30px); opacity: 0; } #content .content-area section ul.fe:not(.feL) li { transform: translate(0 , -30px); opacity: 0; } #content .content-area section h3, #content .content-area section table tr > td{transition: .5s ease-in;} #content .content-area section h4{transition: .7s ease-in;} #content .content-area section p, #content .content-area section table tr > th{transition: .3s ease-in;} #content .content-area section h2, #content .content-area section ul.fe:not(.feL) li{transition: .3s ease-in;} #content .content-area section h2.active, #content .content-area section h3.active, #content .content-area section h4.active, #content .content-area section p.active, #content .content-area section ul.fe:not(.feL) li.active, #content .content-area section table tr.active > *{ transform:translate(0 , 0); opacity:1; } #content .content-area section figure img{ transform: scale(70%, 70%); -webkit-transform: scale(.7 , .7); opacity:0; transition: .6s ease-in; } #content .content-area section figure.active img{ transform: scale(100%, 100%); -webkit-transform: scale(1.0 , 1.0); opacity:1; } @media only screen and (min-width:1000px){ .sp{display:none;} html {font-size: calc(9vw / 19.1);} } @media only screen and (min-width:1500px){ .sp{display:none;} html {font-size: calc(7vw / 19.1);} } @media only screen and (max-width:1000px){ .pc{display:none;} html {font-size: calc(20vw / 19.1);} body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {font-size: 3rem;} }