@charset "utf-8"; /*--------------------------------------------- g2-l1 common ---------------------------------------------*/ main article h1 { margin: 2px 0 0 -9px; color: #002e66; font-family: "Noto Sans Regular", sans-serif; font-size: 2.3rem; } main article h1 em { font-family: "Noto Sans Medium", sans-serif; } main article h1 strong { margin-left: 10px; font-family: "Noto Sans Light", sans-serif; font-size: 3.3rem; } main article h2 { height: 41px; margin-top: 11px; padding-top: 2px; background: #009fd6; color: #fff; font-family: "Noto Sans Medium", sans-serif; font-size: 2.4rem; } main article h3 { height: 238px; padding-top: 90px; background: #002e66 url("/ja/system/iot/support/learning/assets/images/bg_pagetitle.png") no-repeat 1022px 0; color: #fff; font-family: "Noto Sans Medium", sans-serif; font-size: 4.0rem; } .flowList dt { position: relative; margin-bottom: 20px; font-weight: bold; margin-top: -4px; } .flowList dt:before { content: "■"; margin-right: 1px; position: relative; left: -5px; top: -1px; } .flowList dd { color: #999; } .flowList dd .active { color: #0270c0 ; font-weight: bold;} .flowList li { position: relative; } .flowList li + li { margin-top: 43px !important; } .flowList li:after { content: ""; position: absolute; background: url("/ja/system/iot/support/learning/assets/images/i_ar_water.png") no-repeat; bottom: -27px; left: 140px; width: 28px; height: 15px; } .flowList li:last-of-type:after { background: none; } .btn-glass { background: url("/ja/system/iot/support/learning/assets/images/i_glass_off.png") no-repeat; width: 95px; height: 27px; cursor: pointer; } .btn-glass:hover { background: url("/ja/system/iot/support/learning/assets/images/i_glass_on.png") no-repeat; } .flowList dt { position: relative; } .flowList dt:before { content: "■"; } .flowList dd { color: #999; } .flowList dd .active { color: #0270c0 ; font-weight: bold;} .linkList { overflow: hidden; } .linkList dt { float:left; width: 50px; height: 31px; background-color:#c3d6ed; text-align:center; font-weight:bold; color:#0270c0; line-height: 31px;} @media all and (-ms-high-contrast:none) {.linkList dt { line-height: 35px; } } .linkList dd { float: left; margin: 2px 0 0 17px; } .decimal li .list { position: relative; padding-left: 11px; font-weight: normal; margin-top: 10px; } .decimal li .list:before { content: ''; position:absolute; left: 0; top: 10px; width: 6px; height: 6px; background-color: #0270c0; -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; } .decimal li .list li:first-child { font-weight: bold; } .decimal li .list li.active { font-weight: normal; color: #e7702f;} .flowList .list li:after { display:none; } .popup-content h2 { margin: -2px 0 23px; color: #002552; font-family: "メイリオ", Meiryo, "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN W3", "游ゴシック", YuGothic, "ＭＳ Ｐゴシック", Helvetica, Arial, sans-serif; font-size: 1.7rem; font-weight: normal; background: none; } #cboxContent { padding: 50px 60px 40px; } main article #contents-box #lNavi { background: #002444 url(/ja/system/iot/support/learning/assets/images/bg_lnav.png) 0 50px no-repeat; } /*--------------------------------------------- g2-l1-0 ---------------------------------------------*/ #g2_l1-0 main article { height: calc(100vh - 62px); min-height: 728px; } #g2_l1-0 main article #gNavi { left: 0 !important; } #g2_l1-0 main article .step-menu { width: 822px; margin-top: 72px; } #g2_l1-0 main article .step-menu figure { padding-left: 58px; } #g2_l1-0 main article .step-menu ol { margin-top: 31px; } #g2_l1-0 main article h2 { background-image: url("/ja/system/iot/support/learning/assets/images/bg_titlebar.png"); background-repeat: no-repeat; background-position: 1095px 0; } #g2_l1-0 main article h3 { background-image: url("/ja/system/iot/support/learning/assets/images/bg_titlebar2.png"); background-position: 1095px 0; } /*--------------------------------------------- g2-l1-1 ---------------------------------------------*/ #g2_l1-1 main article .lead { font-size: 1.7rem; margin: 34px 0 52px; } #g2_l1-1 main article .col-1 figure { float: none; width: auto; margin: 0; } #g2_l1-1 main article #contents-box section h4 em:after { top: -1px; } /*--------------------------------------------- g2-l1-2 ---------------------------------------------*/ #g2_l1-2 .commentary { margin-left: 72px; } #g2_l1-2 .commentary .popup { margin-top: 37px; font-weight: bold; } #g2_l1-2 .commentary .blowclick { position: relative; top: 6px; left: 31px; display: block; width: 171px; height: 59px; background: url("/ja/system/iot/support/learning/assets/images/btn_blowclick_blink.png") no-repeat; } #g2_l1-2 .commentary .blowclick img { visibility: hidden; animation: blink-blow 1s infinite; } #g2_l1-2 .commentary .blowclick img.noanime { visibility: visible; animation: none; } @keyframes blink-blow{ 0% { visibility: hidden; } 49%{ visibility: hidden; } 50%{ visibility: visible; } 100%{ visibility: visible; } } /*--------------------------------------------- g2_l1-2-1 ---------------------------------------------*/ #g2_l1-2-1 ul li { position: relative; padding-left: 20px; } #g2_l1-2-1 ul li:before { content: ""; position: absolute; top: 12px; left: 0; width: 7px; height: 7px; border-radius: 50%; background: #000; } /*--------------------------------------------- g2-l1-3 ---------------------------------------------*/ #g2_l1-3 main article #contents-box section figure { width: 485px; margin-top: 2px; position: relative; left: -1px; } #g2_l1-3 main article #contents-box section .commentary { margin-top: -1px;} #g2_l1-3 .commentary { margin-left: 49px; } #g2_l1-3 .commentary p { margin-bottom: 32px; } /*--------------------------------------------- g2_l1-3-1 ---------------------------------------------*/ #g2_l1-3-1 ul { margin-top: 20px; display: -ms-flexbox; display: -webkit-flex; display: flex;-webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between; overflow: hidden; } #g2_l1-3-1 ul li { position:relative; } #g2_l1-3-1 ul li:after { content: ''; position:absolute; top: 50%; right: -34px; width: 16px; height: 27px; margin-top: -36px; background: url(/ja/system/iot/support/learning/assets/images/i_ar_water_right.png) 0 0 no-repeat; } #g2_l1-3-1 ul li p { position: relative; line-height: 1.58; padding-left: 17px; margin-bottom: 14px; text-indent: 4px; } #g2_l1-3-1 ul li p span { position: absolute; left: 0; text-indent: -2px; } #g2_l1-3-1 .note1 { margin-left: -1px; font-size: 1.3rem; padding-left: 0; text-indent: 11px; margin-top: 11px; line-height: 1.7; } #g2_l1-3-1 .note1:before { content: '※'; left: 0; position: absolute; top: 0; text-indent: -2px;} #g2_l1-3-1 .note2 { font-size: 1.4rem; line-height: 1.7; padding-left: 0px; text-indent: 0; margin-top: 4px; color: #e7702f; } /*--------------------------------------------- g2-l1-4 ---------------------------------------------*/ #g2_l1-4 main article #contents-box section figure { width: 494px; margin-top: 2px; position: relative; left: -1px; } #g2_l1-4 main article #contents-box section .commentary { width: 454px; margin-top: 3px; } #g2_l1-4 .commentary { margin-left: 42px; width: 454px;} #g2_l1-4 .flowList dd { padding-left: 22px; margin-bottom: 34px; } #g2_l1-4 .flowList li:after { left: 117px; } #g2_l1-4 .flowList li + li { margin-top: 43px !important; } /*--------------------------------------------- g2-l1-5 ---------------------------------------------*/ #g2_l1-5 main article #contents-box section figure { width: 494px; margin-top: 2px; position: relative; left: -1px; } #g2_l1-5 main article #contents-box section .commentary { width: 454px; margin-top: 3px; } #g2_l1-5 .commentary { margin-left: 42px; width: 454px;} #g2_l1-5 .flowList dd { padding-left: 22px; margin-bottom: 34px; } #g2_l1-5 .flowList li:after { left: 117px; } #g2_l1-5 .flowList li + li { margin-top: 43px !important; } /*--------------------------------------------- g2-l1-6 ---------------------------------------------*/ #g2_l1-6 main article #contents-box section figure { width: 486px; margin-top: 2px; position: relative; left: -2px; } #g2_l1-6 main article #contents-box section .commentary { width: 454px; margin-top: 3px; } #g2_l1-6 .commentary { margin-left: 50px; width: 454px;} #g2_l1-6 .flowList dt { } #g2_l1-6 .flowList dd { padding-left: 22px; margin-bottom: 34px; } #g2_l1-6 .flowList li:after { left: 117px; } #g2_l1-6 .flowList li + li { margin-top: 43px !important; } #g2_l1-6 .comset { position: relative;} #g2_l1-6 .comset p { position: absolute; left: -1px; top: 398px; font-size: 1.4rem; letter-spacing: 0.01em; color:#e7702f; } /*--------------------------------------------- g2_l1-6-1 ---------------------------------------------*/ #g2_l1-6-1 th:first-child { width: 153px; } #g2_l1-6-1 th:nth-child(2) { width: 296px; } #g2_l1-6-1 td { height: 82px; } /*--------------------------------------------- g2-l1-7 ---------------------------------------------*/ #g2_l1-7 main article #contents-box section figure { width: 494px; margin-top: 2px; position: relative; left: -1px; } #g2_l1-7 main article #contents-box section .commentary { width: 453px; margin-top: 3px; } #g2_l1-7 main article #contents-box section .commentary .flowList dt { margin-left: -1px;} #g2_l1-7 .commentary { margin-left: 43px; width: 453px;} #g2_l1-7 .flowList dd { padding-left: 21px; } #g2_l1-7 .flowList li:after { left: 117px; } #g2_l1-7 .flowList li + li { margin-top: 43px !important; } #g2_l1-7 .comset { position: relative;} #g2_l1-7 .comset p { position: absolute; left: -1px; top: 398px; font-size: 1.4rem; letter-spacing: 0.025em; color:#e7702f; } /*--------------------------------------------- g2-l1-8 ---------------------------------------------*/ #g2_l1-8 main article #contents-box section figure { width: 485px; margin-top: 2px; position: relative; left: -1px; } #g2_l1-8 main article #contents-box section .commentary { width: 453px; margin-top: 3px; } #g2_l1-8 main article #contents-box section .commentary .flowList dt { margin-left: -1px;} #g2_l1-8 .commentary { margin-left: 52px; width: 453px;} #g2_l1-8 .flowList dd { padding-left: 21px; } #g2_l1-8 .flowList li:after { left: 117px; } #g2_l1-8 .flowList li + li { margin-top: 45px !important; } #g2_l1-8 .flowList .list li + li { margin-top: 0 !important; } #g2_l1-8 .comset { position: relative;} #g2_l1-8 .comset p { position: absolute; left: -1px; top: 398px; font-size: 1.4rem; letter-spacing: 0.025em; color:#e7702f; } /*--------------------------------------------- g2-l1-9 ---------------------------------------------*/ #g2_l1-9 main article #contents-box section figure { width: 485px; margin-top: 2px; position: relative; left: -1px; } #g2_l1-9 main article #contents-box section .commentary { width: 454px; margin-top: 3px; } #g2_l1-9 .commentary { margin-left: 51px; width: 454px;} #g2_l1-9 .flowList dd { color:#000; } #g2_l1-9 .comset { position: relative;} #g2_l1-9 .comset .point { position: absolute; left: 129px; top: 398px; font-size: 1.4rem; letter-spacing: 0.025em; color:#e7702f; } /*--------------------------------------------- g2-l1-10 ---------------------------------------------*/ #g2_l1-10 main article #contents-box section figure { width: 485px; margin-top: 2px; position: relative; left: -1px; } #g2_l1-10 main article #contents-box section .commentary { width: 453px; margin-top: 3px; } #g2_l1-10 main article #contents-box section .commentary .flowList dt { margin-left: -1px; } #g2_l1-10 main article #contents-box section .commentary .flowList .decimal { width: 433px; } #g2_l1-10 .commentary { margin-left: 52px; width: 453px;} #g2_l1-10 .flowList dd { padding-left: 21px; } #g2_l1-10 .flowList li:after { left: 117px; } /*--------------------------------------------- g2-l1-11 ---------------------------------------------*/ #g2_l1-11 main article #contents-box section figure { width: 486px; margin-top: 2px; position: relative; left: -1px; } #g2_l1-11 main article #contents-box section .commentary { width: 453px; margin-top: 3px; } #g2_l1-11 main article #contents-box section .commentary .flowList dt { margin-left: -1px; } #g2_l1-11 .commentary { margin-left: 51px; } #g2_l1-11 .flowList dd { padding-left: 21px; } #g2_l1-11 .flowList li { white-space: nowrap; } #g2_l1-11 .flowList li:after { left: 117px; } /*--------------------------------------------- g2-l1-12 ---------------------------------------------*/ #g2_l1-12 main article #contents-box section figure { width: 485px; margin-top: 2px; position: relative; left: -1px; } #g2_l1-12 main article #contents-box section .commentary { width: 453px; margin-top: 3px; } #g2_l1-12 main article #contents-box section .commentary .flowList dt { margin-left: -1px; } #g2_l1-12 .commentary { margin-left: 52px; } #g2_l1-12 .flowList dd { padding-left: 21px; } #g2_l1-12 .flowList li { white-space: nowrap; } #g2_l1-12 .flowList li:after { left: 117px; } /*--------------------------------------------- g2_l1-13 ---------------------------------------------*/ #g2_l1-13 main article #contents-box section figure { width: 485px; margin-top: 2px; position: relative; left: -1px; } #g2_l1-13 main article #contents-box section .commentary { float: left; width: 453px; margin-top: 3px;} #g2_l1-13 main article #contents-box section .commentary .flowList dt { margin-left: -1px; } #g2_l1-13 main article #contents-box section .flowList li.active{ letter-spacing: -0.2px; } #g2_l1-13 main article #contents-box section .btn-glass { position: relative; top: -26px; left: -1px;} #g2_l1-13 main article #contents-box section ol.decimal { margin-left: 21px } #g2_l1-13 .flowList li:after { left: 117px; } #g2_l1-13 .flowList li { white-space: nowrap; } #g2_l1-13 .commentary { margin-left: 52px; } /*--------------------------------------------- g2_l1-14 ---------------------------------------------*/ #g2_l1-14 main article #contents-box section figure { width: 485px; margin-top: 2px; position: relative; left: -1px; } #g2_l1-14 main article #contents-box section .commentary { width: 453px; margin-top: 3px; } #g2_l1-14 main article #contents-box section .commentary .flowList dt { margin-left: -1px; } #g2_l1-14 .commentary { margin-left: 52px; } #g2_l1-14 .flowList dd { padding-left: 21px; } #g2_l1-14 .flowList li { white-space: nowrap; } #g2_l1-14 .flowList li span { position: relative; top: -2px;display: block; color: #e7702f; } #g2_l1-14 .flowList li:after { left: 117px; } #g2_l1-14 .btn-glass { position: relative; margin-top: 4px; left: -1px;} /*--------------------------------------------- g2_l1-15 ---------------------------------------------*/ #g2_l1-15 main article #contents-box section { padding: 28px 0 0 101px;} #g2_l1-15 main article #contents-box { background-color: #dedddb;} #g2_l1-15 main article #contents-box #lNavi nav > ul > li > a.active { background-color: #dedddb; font-family: "Noto Sans Bold"; } #g2_l1-15 main article #contents-box section .point h4 { position:relative; padding: 4px 0 1px 7px; margin-bottom: 25px; } #g2_l1-15 main article #contents-box section .point h4:before { position:absolute; content: ''; left: 0; top: 3px; width: 146px; height: 33px; background: url(/ja/system/iot/support/learning/assets/images/bg_titlebar3.png) 0 0 no-repeat; z-index: 0; } #g2_l1-15 main article #contents-box section .point h4 em { display: inline-block; color: #fff; margin: 0 100px 3px 0px; position: relative; top: 2px; } #g2_l1-15 main article #contents-box section h5 { font-size: 2.2rem; margin: 0 0 15px -7px; } #g2_l1-15 main article #contents-box section .point h4 em:after { content: none; } #g2_l1-15 .point { position: relative; } #g2_l1-15 .point .text1 { position: absolute; font-size: 1.4rem; background-color: #e7702f; color: #fff; right: 0px; top: 42px; letter-spacing: -0.05em; } #g2_l1-15 .point .content { position:relative; } #g2_l1-15 .point .content figure { padding-left: 149px; } #g2_l1-15 .point .content a { font-size: 1.7rem; line-height: 1.6; font-weight: bold; } #g2_l1-15 .point .content a:link { color:#1faee7; } #g2_l1-15 .point .content a.true { color:#000; } #g2_l1-15 .point .content ul { position: absolute; } #g2_l1-15 .point .content ul li { font-size: 1.7rem; line-height: 1.6; } #g2_l1-15 .point .content ul li + li { margin-top: 30px; } #g2_l1-15 .point .content .list1 { top: 66px; left: -2px; } #g2_l1-15 .point .content .list2 { top: 24px; right: 46px; } #g2_l1-15 .point .content .text2 { position:absolute; left: 49px; top: 347px; font-size: 1.7rem; line-height: 1.6; } /*--------------------------------------------- g2_l1-15-1 ---------------------------------------------*/ #g2_l1-15-1 h2 { color:#000; } #g2_l1-15-1 th:nth-child(1) { width: 94px;} #g2_l1-15-1 th:nth-child(2) { width: 57px;} #g2_l1-15-1 th:nth-child(3) { width: 425px;} #g2_l1-15-1 th.upper span { font-size: 1.2rem;} #g2_l1-15-1 th.upper { padding: 9px 10px 6px; } #g2_l1-15-1 th { padding: 30px 12px 27px; } #g2_l1-15-1 td { padding: 4px 5px 3px 10px; letter-spacing: normal;} #g2_l1-15-1 td.space1 { letter-spacing: -0.03em;} #g2_l1-15-1 td.space2 { letter-spacing: -0.04em;} #g2_l1-15-1 td.icon { text-align: center;} #g2_l1-15-1 td .icon1 { position: relative;top: -3px; left: -3px; } #g2_l1-15-1 td .icon2 { position: relative; top: -3px; left: -3px; } #g2_l1-15-1 td .icon3 { position: relative; top: -1px; left: -3px; } #g2_l1-15-1 td .icon4 { position: relative; top: -3px; left: -3px; } #g2_l1-15-1 .lower { border-bottom-width: 2px; } /*--------------------------------------------- g2_l1-15-2 ---------------------------------------------*/ #g2_l1-15-2 .content { overflow:hidden; } #g2_l1-15-2 h2 { margin: -2px 0 32px; height: inherit; line-height: 1.7; color:#000; } #g2_l1-15-2 .content figure { width: 595px; float: left;} #g2_l1-15-2 .content dl { width: 330px; float: left; margin: -4px 0 0 28px;} #g2_l1-15-2 .content dl dt { font-weight: bold; font-size: 2rem; color:#1faee7; margin-bottom: 5px; } #g2_l1-15-2 .content dl dt span { font-weight: normal; } #g2_l1-15-2 .content dl dd { width: 330px; float: left; } #g2_l1-15-2 .content dl dd p { font-size: 1.7rem; margin-bottom: 3px; } #g2_l1-15-2 .content dl dd ol { font-size: 1.8rem; padding-left: 30px; } #g2_l1-15-2 .content dl dd ol li { margin-bottom: 0; color:#000; font-weight: bold; } #g2_l1-15-2 .content dl dd ol li:before { counter-increment: item; content: counter(item); display: block; position: absolute; top: 5px; left: -28px; width: 20px; height: 20px; -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; font-size: 1.4rem; font-weight: bold; color: #fff; text-align: center; line-height: 20px; background-color:#1faee7; } /*--------------------------------------------- g2_l1-15-3 ---------------------------------------------*/ #g2_l1-15-3 .content { overflow:hidden; } #g2_l1-15-3 h2 { margin: -2px 0 32px; height: inherit; line-height: 1.7; color:#000; } #g2_l1-15-3 .content figure { width: 520px; float: left; } #g2_l1-15-3 .content dl { width: 330px; float: left; margin: -4px 0 0 38px; } #g2_l1-15-3 .content dl dt { font-weight: bold; font-size: 2rem; color:#1faee7; margin-bottom: 8px; } #g2_l1-15-3 .content dl dt span { font-weight: normal; } #g2_l1-15-3 .content dl dd { width: 330px; float: left;} #g2_l1-15-3 .content dl dd p { font-size: 1.7rem; margin-bottom: 3px; } #g2_l1-15-3 .content dl dd ol { font-size: 1.8rem; padding-left: 30px;} #g2_l1-15-3 .content dl dd ol li { margin-bottom: 0; color:#000; font-weight: bold; } #g2_l1-15-3 .content dl dd ol li:before { counter-increment: item; content: counter(item); display: block; position: absolute; top: 5px; left: -28px; width: 20px; height: 20px; -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; font-size: 1.4rem; font-weight: bold; color: #fff; text-align: center; line-height: 20px; background-color:#1faee7; } /*--------------------------------------------- g2_l1-15-4 ---------------------------------------------*/ #g2_l1-15-4 .content { overflow:hidden; } #g2_l1-15-4 h2 { margin: -2px 0 32px; height: inherit; line-height: 1.7; color:#000; } #g2_l1-15-4 .content figure { width: 520px; float: left;} #g2_l1-15-4 .content dl { width: 330px; float: left; margin: -4px 0 0 38px; } #g2_l1-15-4 .content dl dt { font-weight: bold; font-size: 2rem; color:#1faee7; margin-bottom: 11px; } #g2_l1-15-4 .content dl dt span { font-weight: normal;} #g2_l1-15-4 .content dl dd { width: 330px; float: left;} #g2_l1-15-4 .content dl dd ol { font-size: 1.8rem; padding-left: 30px;} #g2_l1-15-4 .content dl dd ol li { margin-bottom: 0; color:#000; font-weight: bold; } #g2_l1-15-4 .content dl dd ol li:before { counter-increment: item; content: counter(item); display: block; position: absolute; top: 5px; left: -28px; width: 20px; height: 20px; -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; font-size: 1.4rem; font-weight: bold; color: #fff; text-align: center; line-height: 20px; background-color:#1faee7; } /*--------------------------------------------- g2_l1-15-5 ---------------------------------------------*/ #g2_l1-15-5 main article h2 { line-height: 1.7; height: inherit; margin: -1px 0 26px; color:#000; } #g2_l1-15-5 main article h3 { font-weight: bold; font-size: 2rem; color: #1faee7; margin-bottom: 11px; background: none; height: inherit; padding-top: 0; font-family: "メイリオ", Meiryo, "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN W3", "游ゴシック", YuGothic, "ＭＳ Ｐゴシック", Helvetica, Arial, sans-serif;} #g2_l1-15-5 main article h3 span { font-weight: normal; } #g2_l1-15-5 table { width: 790px; } #g2_l1-15-5 th:nth-child(1) { width: 195px; text-align: left; } #g2_l1-15-5 th { vertical-align: top; padding: 18px 13px 16px; background-color: #e8f7fd; } #g2_l1-15-5 td { vertical-align: top; padding: 18px 6px 16px 9px; letter-spacing: normal; } #g2_l1-15-5 .upper { border-top-width: 2px; border-bottom-width: 1px;} #g2_l1-15-5 .lower { border-top-width: 1px; border-bottom-width: 2px;} /*--------------------------------------------- g2_l1-15-6 ---------------------------------------------*/ #g2_l1-15-6 main article h2 { line-height: 1.6; height: inherit; margin: -1px 0 26px; color:#000; width: 377px; float:left; } #g2_l1-15-6 main article h3 { font-weight: bold; font-size: 2rem; color: #1faee7; margin-bottom: 14px; background: none; height: inherit; padding-top: 0; font-family: "メイリオ", Meiryo, "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN W3", "游ゴシック", YuGothic, "ＭＳ Ｐゴシック", Helvetica, Arial, sans-serif;} #g2_l1-15-6 main article h3 span { font-weight: normal; } #g2_l1-15-6 .content { overflow: hidden; margin-bottom: 25px; } #g2_l1-15-6 .content figure { width: 552px; float:right; margin: 7px 48px 0 0; } #g2_l1-15-6 table { width: 790px; } #g2_l1-15-6 th:nth-child(1) { width: 167px; text-align: left; } #g2_l1-15-6 th { vertical-align: top; padding: 18px 10px 15px; background-color:#e8f7fd; color:#000; } #g2_l1-15-6 td { vertical-align: top; padding: 18px 6px 15px 9px; letter-spacing: normal;} #g2_l1-15-6 .upper { border-top-width: 2px; border-bottom-width: 1px;} #g2_l1-15-6 .lower { border-top-width: 1px; border-bottom-width: 2px;} /*--------------------------------------------- g2_l1-15-7 ---------------------------------------------*/ #g2_l1-15-7 main article h2 { margin: 0 0 32px; height: inherit; line-height: 1.7; color:#000; } #g2_l1-15-7 .content figure { width: 520px;} /*--------------------------------------------- g2_l1-16 ---------------------------------------------*/ #g2_l1-16 dl { display: table; width: 100%; table-layout: fixed; } #g2_l1-16 dl dt { display:table-cell; vertical-align: top; width: 271px; } #g2_l1-16 dl dd { display:table-cell; vertical-align: top; } #g2_l1-16 h2 { height: 50px; margin-top: 0; padding: 10px 0 0 28px; font-size: 2.0rem; background: #009fd6; color: #fff; font-family: "Noto Sans Medium"; text-align: left; } #g2_l1-16 h3 { height: 50px; background: #002e66 url(/ja/system/iot/support/learning/assets/images/bg_pagetitle.png) no-repeat 1022px 0; color: #fff; padding: 9px 0 0 19px; font-family: "Noto Sans Regular"; font-size: 2.0rem; } #g2_l1-16 h4 { height: 158px; padding-top: 30px; background-color: #dddddd; color: #002e66; font-size: 3.6rem; letter-spacing: 0.03em; font-weight: normal; line-height: 1.67; } #g2_l1-16 h4 span { display:block; font-size: 2.4rem; padding-left: 16px;} #g2_l1-16 figure { margin: 34px 0 0 12px; } #g2_l1-16 main article { height: calc(100vh - 62px); min-height: 728px;} #g2_l1-16 main article h1 { margin: 2px 0 11px -8px; }