@charset "UTF-8";
/* CSS Document */

.SanomatSans-Regular-Web{ font-family: 'Sanomat Sans Web','Source Han Sans', sans-serif; }
.SanomatSans-Medium-Web{ font-family: 'Sanomat Sans Web','Source Han Sans', sans-serif; }
.SanomatSans-Light-Web{ font-family: 'Sanomat Sans Web','Source Han Sans', sans-serif; }
.SanomatSans-Thin-Web{ font-family: 'Sanomat Sans Web','Source Han Sans', sans-serif; }

section{ margin-left: auto; margin-right: auto; background-color: #fff; }

section .inner{ display:block; }
section .inner h2{ }

main article{ padding-top: 85px; padding-top: 0px; overflow: hidden; }

.n_logo{ display: inline-block; width: 145px; height: 33px; position: relative; }
.n_logo:before{ content: ""; display: block; width: 145px; height: 33px; }
.n_logo:after{ content: ""; display: block; width: 145px; height: 33px; background-image: url("../img/NIKKEI.40dd0cc5d7f7.svg"); background-repeat: no-repeat; background-size:145px auto; position: absolute; top: 0px; left: 0px; }

.s_logo{ display: inline-block; width: 162px; height: 46px; position: relative; }
.s_logo:before{ content: ""; display: block; width: 162px; height: 46px; }
.s_logo:after{ content: ""; display: block; width: 162px; height: 46px;  background-image: url("../img/Slack_RGB.24a78dc42d3d.svg"); background-repeat: no-repeat; background-size:162px auto; position: absolute; top: 3px; left: 0px; }

main article .intro{ padding-bottom: 115px; padding-top: 85px; position: relative; z-index: 10; background-color: #fff; }
main article .intro .inner .logos{ width: 380px; margin-left: auto; margin-right: auto; margin-bottom: 60px; }
main article .intro .inner .logos .n_logo{ margin-right: 73px; }

main article .intro .inner>h1.copy:before{ content: ""; display: block; width: 100px; height: 1px; overflow:hidden; background-color: #ecb32d; position: absolute; bottom: 0px; left: calc(50% - 50px); }

main article .intro .inner>h1.copy{ font-weight: normal; font-size: 24px; line-height: 1.8em; padding-bottom: 25px; margin-bottom: 35px; text-align: center; position: relative; }
main article .intro .inner>p{ text-align: center; font-size: 16px; line-height: 2.0em; }

main article .intro .inner .anime h1.copy:before{ content: ""; display: block; width: 100px; height: 1px; overflow:hidden; background-color: #ecb32d; position: absolute; bottom: 0px; left: calc(50% - 50px); }

main article .intro .inner .anime h1.copy{ font-weight: normal; font-size: 24px; line-height: 1.8em; padding-bottom: 25px; margin-bottom: 35px; text-align: center; position: relative; }
main article .intro .inner .anime p{ text-align: center; font-size: 15px; line-height: 1.8em; }
main article .intro .inner .anime .denshiban p:first-child{ text-align: left; }
main article .intro .inner .anime{ margin-bottom: 65px; }

main article .intro:before{ content: ""; display: block; width: 50%; height: 8px; background-color: #00629d; position: absolute; left: 0px; bottom: 0px; }
main article .intro:after{ content: ""; display: block; width: 50%; height: 8px; background-color: #63c1a0; position: absolute; right: 0px; bottom: 0px; }

#dl main article .intro:before{ content: ""; display: block; width: 100%; height: 4px; background-color: #00629d; position: absolute; left: 0px; bottom: 0px; }
#dl main article .intro:after{ content: ""; display: none; width: 50%; height: 8px; background-color: #63c1a0; position: absolute; right: 0px; bottom: 0px; }

main article section{  }

.flex-box{ display: flex; justify-content: space-between; }

section#about{ background-color: #fff; z-index: 600; position: relative; }
section#about .inner{ padding-top: 84px; max-width: 1000px; margin-left: auto; margin-right: auto; padding-bottom: 130px; position: relative; z-index: 10; }
section#about .inner .nikkei{ text-align: center; width: 400px; }

section#about .inner .nikkei .n_logo{ margin-bottom: 65px; padding-top: 6px; width: 184px; height: 60px; }
section#about .inner .nikkei .n_logo:before{ display: none; }
section#about .inner .nikkei .n_logo:after{ display: none; }
section#about .inner .nikkei .n_logo a{ display: block; width: 184px; height: 60px; }
section#about .inner .nikkei .n_logo a:before{ content: ""; display: block; width: 184px; height: 60px; }
section#about .inner .nikkei .n_logo a:after{ content: ""; display: block; top: 0px; width: 184px; height: 60px; background-size: 184px auto; background-position: top 6px center; background-image: url("../img/NIKKEI.40dd0cc5d7f7.svg"); background-repeat: no-repeat; position: absolute; top: 0px; left: 0px;}

section#about .inner .nikkei h2{ font-size: 20px; padding-bottom: 10px; color: #666666; margin-bottom: 60px; border-bottom: solid 1px #666; display: block; width: 151px; margin-left: auto; margin-right: auto; letter-spacing: 0.03em; }

section#about .inner .slack{ text-align: center; width: 400px; }
section#about .inner .slack .s_logo{ margin-bottom: 65px; width: 210px; height: 60px; }
section#about .inner .slack .s_logo:before{ display: none; }
section#about .inner .slack .s_logo:after{ display: none; }

section#about .inner .slack .s_logo a{ display: block; width: 210px; height: 60px; }
section#about .inner .slack .s_logo a:before{ content: ""; display: block; width: 210px; height: 60px; }
section#about .inner .slack .s_logo a:after{ content: ""; display: block; top: 0px; width: 210px; height: 60px; background-size: auto 60px; background-position: top 0px left; background-image: url("../img/Slack_RGB.24a78dc42d3d.svg"); background-repeat: no-repeat; position: absolute; top: 0px; left: 0px;}


section#about .inner .slack h2{ font-size: 20px; padding-bottom: 10px; color: #666666; margin-bottom: 60px; border-bottom: solid 1px #666; display: block; width: 100px; margin-left: auto; margin-right: auto; letter-spacing: 0.03em; }
section#about .inner .txt-box{ text-align: left; }
section#about .inner .txt-box h3{ font-size: 18px; line-height: 1.8em; margin-bottom: 40px; }
section#about .inner .txt-box p{ font-size: 15px; line-height: 2.0em; }


section#n_for_s{ background-color: transparent; position: relative; padding-bottom: 190px; margin-bottom: 470px; z-index: 100; }
section#n_for_s:before{ content: ""; background-color: #63c1a0; width: 300%; height: 900px; transform: rotate(-7deg); position: absolute; left: -100%; top: 140px; z-index: 8; }
section#n_for_s:after{ content: ""; background-color: #fff; width: 300%; height: 750px; background-color: #fff; position: absolute; left: -100%; top: -200px; z-index: 2; }
section#n_for_s .inner{ position: relative; max-width: 1000px; margin-left: auto; margin-right: auto; z-index: 10; }

section#n_for_s .inner .a-block{ width: 480px; overflow:hidden; }
section#n_for_s .inner .a-block .hd{ width: 480px; }
section#n_for_s .inner .a-block .hd h2{ font-size: 72px; line-height: 1.4em; color: #63c1a0; margin-bottom: 130px; width: 480px; }
section#n_for_s .inner .a-block .hd h2 span{ display: block; font-size: 24px; line-height: 1em; letter-spacing: .3em; color: #333333; }

section#n_for_s .inner .flex-box p{ font-size: 16px; line-height: 2.0em;}

section#n_for_s .inner .flex-box .lf{ padding-right: 30px; width: 370px; }
section#n_for_s .inner .flex-box .lf .ttl{ margin-bottom: 30px; width: 370px; }
section#n_for_s .inner .flex-box .lf .a-block{ width: 370px; overflow: hidden; display: block; }
section#n_for_s .inner .flex-box .lf .ttl h3{ background-color: #fff; display: inline; font-size: 24px; line-height: 1.8em; color: #3a9d7a; }
section#n_for_s .inner .flex-box .lf .txt{ width: 370px; }
section#n_for_s .inner .flex-box .lf p{ margin-bottom: 60px; padding-right: 50px;  }
section#n_for_s .inner .flex-box .lf img{ margin-left: -140px; width: 468px; }

section#n_for_s .inner .flex-box .ri{ width: 600px; }
section#n_for_s .inner .flex-box .ri .ttl{ margin-bottom: 10px; padding-left: 95px; }
section#n_for_s .inner .flex-box .ri .ttl h4{ background-color: #3a9d7a; color: #fff; display: inline; font-size: 24px; line-height: 1.8em; }

section#n_for_s .inner .flex-box .ri .txt{ padding-left: 95px; }

section#n_for_s .inner .flex-box .ri .items{ }
section#n_for_s .inner .flex-box .ri .item{ margin-bottom: 40px; padding-left: 95px; padding-left: 0px; position: relative; width: 600px; box-sizing: border-box; }
section#n_for_s .inner .flex-box .ri .a-block{ width: 600px; overflow: hidden; display: block; }
section#n_for_s .inner .flex-box .ri .item i{ font-size: 60px; line-height: 1em; font-style: normal; position: absolute; left: 0px; top: 0px; display: block; color: #a8ead3; }


.photoarea{ position: relative; }
.photoarea .robo:before{ content: ""; display: block; position:absolute; left: 0px; top: calc(50% - ( 1977px / 2 )); background-image: url("../img/PhotoArea_bg.16c33085f733.png"); background-size: auto; height: 1977px; width: 50%; z-index:0; }
.photoarea:after{ content: ""; display: none; position:fixed; right: 0px; top: calc(50% - ( 1977px / 2 )); background-image: url("../img/PhotoArea_bg2.f36b5139b079.png"); background-size: cover; height: 876px; width: 50%; z-index: -10; }
.photoarea .robo{ position: absolute; left: 0; top: calc(50% - ( 1977px / 2 )); height: 1977px; width: 100%; display: block; background-image: url("../img/PhotoArea_bg2.f36b5139b079.png"); z-index: 0; }
.photoarea .robo img{ display: block; margin-left: auto; margin-right: auto; position: relative; }

section#n_for_s_function{ background-color: transparent; position: relative; padding-bottom: 80px; margin-bottom:0px; z-index: 100; }
section#n_for_s_function:before{ content: ""; background-color: #00629d; width: 300%; height: 900px; transform: rotate(-7deg); position: absolute; left: -100%; top:-40px; z-index: 8; }
section#n_for_s_function:after{ content: ""; background-color: #fff; width: 300%; height: 750px; background-color: #fff; position: absolute; left: -100%; bottom: -200px; z-index: 2; }

section#n_for_s_function .inner{ position: relative; max-width: 1000px; margin-left: auto; margin-right: auto; z-index: 10; padding-bottom: 290px; }
section#n_for_s_function .inner .hd{ width: 1000px; }
section#n_for_s_function .inner .hd h2{ text-align: right; font-size: 30px; line-height: 1.6em; margin-bottom: 30px; color: #e4e7eb; }
section#n_for_s_function .inner .hd h2 i{ width: 30px; height: 26px; display: inline-block; position: relative; }
section#n_for_s_function .inner .hd h2 i:before{ content: ""; width: 30px; height: 30px; background-image: url("../img/Slack_Mark_Monochrome_White.c8e2fd1fa7e6.svg"); background-repeat: no-repeat; position: absolute; left: 0px; top: 0px; }
section#n_for_s_function .inner .hd h2 span{ display: block; font-size: 36px; letter-spacing: 0.2em; }

section#n_for_s_function .inner .flex-box{  }
section#n_for_s_function .inner .flex-box .item{ width: 300px; }
section#n_for_s_function .inner .flex-box .item img{ margin-bottom: 35px; width: 300px; }
section#n_for_s_function .inner .flex-box .item h4{ color: #e4e7eb; font-size: 18px; line-height: 1.8em; min-height: 220px; text-align: center; }

section#n_for_s_function .inner .flex-box .item h4 i{ display: block; width: 113px; height: 110px; margin-left: auto; margin-right: auto; margin-bottom: 15px; }

section#n_for_s_function .inner .flex-box .item h4 i.ico_01{ background-image: url("../img/ico_01.f525c4a276d0.png"); background-size: 111px auto; background-position: center; background-repeat: no-repeat; }
section#n_for_s_function .inner .flex-box .item h4 i.ico_02{ background-image: url("../img/ico_02.f728fa9fd472.png"); background-size: 111px auto; background-position: center; background-repeat: no-repeat; }
section#n_for_s_function .inner .flex-box .item h4 i.ico_03{ background-image: url("../img/ico_03.775bbda660b5.png"); background-size: 111px auto; background-position: center; background-repeat: no-repeat; }

section#n_for_s_function .inner .flex-box .item p{ color: #e4e7eb; text-align: center; font-size: 15px; line-height: 1.8em; }
section#n_for_s_function .inner .flex-box .item p.t-left{ text-align: left; padding-bottom: 15px; min-height: 106px; }
section#n_for_s_function .inner .flex-box .item p a.detail{ color: #e4e7eb; display: inline-block; border-bottom: solid 1px #e4e7eb; }

section#n_for_s_function .inner .flex-box .item p a.detail:hover{ color: #ecb32d; border-bottom: solid 1px #ecb32d; }

section#n_for_s_function .inner .dl{ position: absolute; left: calc(50% - 116px); bottom: 0px; z-index: 9999; }

.denshiban{ background-color: #f5f5f5; padding: 25px 40px; width: 460px; margin-left: auto; margin-right: auto; }
.denshiban p{ font-size: 15px; line-height: 1.8em; }
.denshiban p:first-child{ margin-bottom: 20px; color: #666666; }
.denshiban p:nth-child(2){ text-align: center; }
.denshiban p:last-child{ text-align: center; font-size: 13px; color: #666666; }
.denshiban p a{ font-size: 18px; line-height: 1em; padding: 20px; border-radius: 8px; background-color: #9d9d9d; color: #fff; display: inline-block; margin-bottom: 20px; }
.denshiban p a:hover{ background-color: #00629d; }

section#fnc_detail{ padding-top: 65px; position: relative; }
section#fnc_detail:before{ content: ""; display: block; width: 300%; height: 100%; background-color: #f7f8f9; position: absolute; left: -150%; top: 0px; }
section#fnc_detail .inner{ position: relative; padding-bottom: 26px; max-width: 1000px; margin-left: auto; margin-right: auto; }

section#fnc_detail .hd{ text-align: center; padding-bottom: 115px; }
section#fnc_detail .hd h2{ font-size: 36px; line-height: 1.1em; color: #00629d; letter-spacing: 0.1em;; }

section#fnc_detail .fuc-box .item{ padding-bottom: 90px; width: 1000px; }
section#fnc_detail .fuc-box .item .ttl{ width: 1000px; padding-bottom: 16px; padding-top: 5px; }
section#fnc_detail .fuc-box .item .ttl i{ margin-right: 40px; width: 133px; height: 158px; display: inline-block; float: left; position: relative; overflow: visible; }

section#fnc_detail .fuc-box .item .a-block{ width: 1000px; overflow: hidden; }

section#fnc_detail .fuc-box .item .ttl i.ico_dl01:before{ content: " "; width: 133px; height: 163px; display: block; background-image: url("../img/ico_dl01.887dbe075ad5.png"); background-size: 133px 163px; position: absolute; left: -7px; top: -5px; }
section#fnc_detail .fuc-box .item .ttl i.ico_dl02:before{ content: " "; width: 133px; height: 163px; display: block; background-image: url("../img/ico_dl02.e74c58b85ea6.png"); background-size: 133px 163px; position: absolute; left: -7px; top: -5px; }
section#fnc_detail .fuc-box .item .ttl i.ico_dl03:before{ content: " "; width: 133px; height: 163px; display: block; background-image: url("../img/ico_dl03.ca94d12d4a1b.png"); background-size: 133px 163px; position: absolute; left: -7px; top: -5px; }
section#fnc_detail .fuc-box .item .ttl i.ico_dl04:before{ content: " "; width: 133px; height: 163px; display: block; background-image: url("../img/ico_dl04.1854d3eeccd6.png"); background-size: 133px 163px; position: absolute; left: -7px; top: -5px; }

section#fnc_detail .fuc-box .item .ttl .txt-box{ max-width: 700px; }

section#fnc_detail .fuc-box .item .ttl .txt-box h3{ font-size: 24px; line-height: 1.1em; color: #00629d; font-weight: normal; margin-bottom: 15px; }

section#fnc_detail .fuc-box .item .ttl .txt-box h3 i.ico_update{ vertical-align:top; float: none; height: auto; margin: 0px; margin-left: 5px; display:inline-flex; justify-content: center; align-items: center; padding: 4px 0px 3px 0px; width: 100px; box-sizing: border-box; text-align: center; font-size: 13px; font-style:normal; line-height: 1.1; border-radius: 5px; position: relative; top: 2px; background-color: #3cbae0; color: #fff; }
section#fnc_detail .fuc-box .item .ttl .txt-box p{ font-size: 18px; line-height: 1.8em; color: #333333; }


section#fnc_detail .fuc-box .item .ttl:after { content: ""; display: block; clear: both; height: 0px; visibility: hidden; overflow: hidden; }

section#fnc_detail .fuc-box .item .flex-box{ }
section#fnc_detail .fuc-box .item .flex-box .img{ width: 700px; min-height: 200px; }
section#fnc_detail .fuc-box .item .flex-box .img img{ width: 700px; height: 420px; }
section#fnc_detail .fuc-box .item .flex-box .img .a-block{ width: 700px; overflow: hidden; background-color: #fff; }

section#fnc_detail .fuc-box .item .flex-box .cont{ width: 273px; }
section#fnc_detail .fuc-box .item .flex-box .cont .inner{ width: 273px; }
section#fnc_detail .fuc-box .item .flex-box .cont ul{ margin-left: 45px;　counter-reset:num; list-style:none; padding-bottom: 10px; }
section#fnc_detail .fuc-box .item .flex-box .cont ul li:before{ background-position: top center; background-repeat: no-repeat; font-family: "Sanomat Sans Web"; font-weight: 500; content: counter(num); display: inline-block; width: 32px; height: 28px; padding-top: 3px; background-image: url("../img/ico_list.fe9881227829.png"); color:#00629d; position: absolute; left: -45px; top: 0px; text-align: center; }
section#fnc_detail .fuc-box .item .flex-box .cont ul li{ color:#666666; padding-bottom: 15px; font-size: 14px; line-height: 1.8em; counter-increment: num; position: relative; margin-left: 0px; }

section#fnc_detail .fuc-box .item .flex-box .cont .border-box{ border: solid 1px #00629d; padding:15px 20px; }
section#fnc_detail .fuc-box .item .flex-box .cont .border-box p{ color: #00629d; font-size: 14px; line-height: 1.8em; }
section#fnc_detail .fuc-box .item .flex-box .cont .a-block{ width: 273px; overflow: hidden; }


section#fnc_detail .fuc-box #detail04.item{ border-top:solid 1px #d2d7db; padding-top: 85px; }
section#fnc_detail .fuc-box #detail04.item .ttl .txt-box h3{ color: #33ad79; }
section#fnc_detail .fuc-box #detail04.item .flex-box .cont .border-box{ border-color: #33ad79; }
section#fnc_detail .fuc-box #detail04.item .flex-box .cont .border-box p{ color: #33ad79; }

section#fnc_detail .fuc-box #detail04.item .flex-box .cont ul li:before{ background-image: url("../img/ico_list2.d152b33dbd32.png"); color:#33ad79; }
section#fnc_detail .fuc-box #detail04.item .ttl .txt-box h3 i.ico_new{ vertical-align:top; float: none; height: auto; margin: 0px; margin-left: 5px; display:inline-flex; justify-content: center; align-items: center; padding: 4px 0px 3px 0px; width: 100px; box-sizing: border-box; text-align: center; font-size: 13px; font-style:normal; line-height: 1.1; border-radius: 5px; position: relative; top: 2px; background-color: #e3ad34; color: #fff; font-size: 13px; }


section#install{ padding-top: 60px; position: relative; background-color: #85dcbd; }
section#install:before{ content: ""; display: block; width: 300%; height: 100%; background-color: #85dcbd; position: absolute; left: -150%; top: 0px; }
section#install .inner{ position: relative; padding-bottom: 115px; max-width: 1000px; margin-left: auto; margin-right: auto; text-align: center; }


section#install .inner h2{ font-size: 30px; line-height: 1.6em; margin-bottom: 28px; display: inline-block; border-bottom: solid 1px #4f997f; color: #1a5641; letter-spacing: 0.05em; }

section#install .inner .cont p{ color: #1a5641; font-size: 18px; line-height: 1.8em; margin-bottom: 28px; }
section#install .inner .cont .img img{ width: 700px; }


section#other{ position: relative; }
section#other .robot{ content: ""; display: block; width: 220px; height: 241px; background-image: url("../img/ROBO.eba70fee7e98.png"); background-repeat: no-repeat; background-size: 222px 244px; right: calc(50% - 560px); top: -136px; position: absolute; }
section#other .inner{ padding-bottom: 150px; padding-top: 100px; }
section#other .inner .cont{ text-align: center; }

section#other .inner .cont>p{ font-size: 14px; line-height: 1.8em; color: #666666; }
section#other .inner .cont p.ttl{ padding-bottom: 23px; }
section#other .inner .cont p.read{ padding-bottom: 23px; }

section#other .inner .cont p a{ color: #00629d; display: inline-block; border-bottom: solid 1px #00629d; }
section#other .inner .cont p a:hover{ color: #ecb32d; border-bottom: solid 1px #ecb32d; }

.botlink{ width: 139px; margin-bottom: 50px; margin-left: auto; margin-right: auto; }
.botlink a{ display: block; border-radius: 6px; background-color: #fff; box-shadow: 0px 0px 3px 0px rgba(0, 0, 0, 0.25); position: relative; }

/*
.botlink a{ display: block; border-radius: 10px; background-color: #fff; box-shadow: 0px 0px 9.3px 0.7px rgba(0, 0, 0, 0.2); padding:30px 55px 30px 115px; position: relative; }
.botlink a p.ttl{ color:#333333; font-size: 28px; line-height: 1.1em; padding-bottom: 0.2em; padding-top: 0.2em; }
.botlink a p.txt{ color:#ce1f5b; font-size: 16px; line-height: 1.1em; }
.botlink a .txt-box{ text-align: center; display: inline-block; }
.botlink a i.slack{ width: 42px; height: 26px; display: inline-block; margin-right: 25px; position: relative; }
.botlink a i.slack:before{ content: ""; display: inline-block; width: 42px; height: 42px; background-image: url("../img/ico_Slack_Mark.856899bf3e36.svg"); background-size: 100%; position: absolute; left: 0px; top: -4px; }

.botlink a:after{ content: ""; display: block; width: 100%; height: 100%; border: solid 8px #ecb32d; position: absolute; left: 0px; top: 0px; box-sizing: border-box; border-radius: 10px; opacity:0; transition: 0.2s cubic-bezier(0.44, 0.18, 0.49, 0.99); }
.botlink a:hover:after{ opacity: 1; }

.mode_sp .botlink a:hover:after{ opacity: 0; }*/

@media (max-width: 1100px) {
    section#about .inner{ max-width: none; margin-left: 50px; margin-right: 50px; }
    section#about .inner .nikkei{ margin-right: 25px; width:calc((100% - 50px) / 2); }
    section#about .inner .slack{ margin-left: 25px; width:calc((100% - 50px) / 2); }


    section#n_for_s .inner{ max-width: none; margin-left: 50px; margin-right: 50px; }
    section#n_for_s .inner .flex-box{ display: block; }
    /*section#n_for_s_function .inner .dl{ left: calc(50% - 80px); }

    section#n_for_s .inner .flex-box .lf{ padding-right: 30px; width: calc(40% - 30px); position: relative; }
    section#n_for_s .inner .flex-box .lf .a-block{ width: auto; }
    section#n_for_s .inner .flex-box .lf .ttl{ width: auto; }
    section#n_for_s .inner .flex-box .lf .txt{ width: auto; }
    section#n_for_s .inner .flex-box .lf img{ position: absolute; right: 30px; bottom: 0; }


    section#n_for_s .inner .flex-box .ri{ width: 60%; }
    section#n_for_s .inner .flex-box .ri .a-block{ width: auto; }
    section#n_for_s .inner .flex-box .ri .item{ width: 100%; }*/

    section#n_for_s{ padding-bottom: 0px; position: relative; z-index: 100; }
    section#n_for_s:before{ height: 95%; top: 120px; }


    section#n_for_s .inner .flex-box .lf .ttl{ width: auto; margin-bottom: 20px; }
    section#n_for_s .inner .flex-box .lf .a-block{ width: auto; }

    section#n_for_s .inner .flex-box .lf{ width: auto; padding-right: 0px; }
    section#n_for_s .inner .flex-box .lf .txt{ width: auto; }
    section#n_for_s .inner .flex-box .lf p{ margin-bottom: 30px; }
    section#n_for_s .inner .flex-box .lf img{ margin-left: auto; margin-right: auto; width: 100%; max-width: 400px; display: block; margin-bottom: 40px; }

    section#n_for_s .inner .flex-box .ri{ width: auto; }
    section#n_for_s .inner .flex-box .ri .a-block{ width: auto; }
    section#n_for_s .inner .flex-box .ri .ttl{ padding-left: 95px; }
    section#n_for_s .inner .flex-box .ri .txt{ padding-left: 95px; }

    section#n_for_s .inner .flex-box .ri .item{ padding-left: 95px; padding-left: 0px; width: auto; }


    section#n_for_s_function .inner{ max-width: none; margin-left: 50px; margin-right: 50px; }
    section#n_for_s_function .inner .hd{ width: auto; }
    section#n_for_s_function .inner .flex-box .item{ margin-right: 25px; margin-left: 25px; width:calc((100% - 100px) / 3); }
    section#n_for_s_function .inner .flex-box .item:first-child{ margin-right: 25px; margin-left: 0px; }
    section#n_for_s_function .inner .flex-box .item:last-child{ margin-right: 0px; margin-left: 25px; }
    section#n_for_s_function .inner .flex-box .item img{ width: 100%; height: auto; }

    section#n_for_s_function .inner .dl{ left: calc(50% - 80px); }

    section#fnc_detail .inner{ max-width: none; margin-left: 50px; margin-right: 50px; }

    section#fnc_detail .fuc-box .item{ width: auto; }
    section#fnc_detail .fuc-box .item .ttl{ width: auto; }
    section#fnc_detail .fuc-box .item .flex-box .img{ width: 60%; }
    section#fnc_detail .fuc-box .item .flex-box .img img{ width: 100%; height: auto; }

    section#fnc_detail .fuc-box .item .flex-box .cont{ width: 40%; }
    section#other .robot{ content: ""; display: block; width: 140px; height: 151px; background-image: url("../img/ROBO.eba70fee7e98.png"); background-repeat: no-repeat; background-size: 140px auto; right: calc(50% - 85px); top: -86px; position: absolute; }


    .photoarea .robo:before{ content: ""; display: none; position:absolute; left: 0px; top: calc(50% - ( 1977px / 2 )); background-image: url("../img/PhotoArea_bg.16c33085f733.png"); background-size: auto; height: 1977px; width: 50%; z-index:0; }
    .photoarea:after{ content: ""; display: none; position:fixed; right: 0px; top: calc(50% - ( 1977px / 2 )); background-image: url("../img/PhotoArea_bg2.f36b5139b079.png"); background-size: cover; height: 876px; width: 50%; z-index: -10; }
    .photoarea .robo{ position: absolute; left: 0; top: calc(50% - 12%); height: 40%; width: 100%; display: block; background-image: url("../img/PhotoArea.816ee65b31bd.png"); background-size: cover; background-repeat: no-repeat; background-position: center;  z-index: 0; overflow: hidden; }
    .photoarea .robo img{ display: none; margin-left: auto; margin-right: auto; position: relative; }

}

@media (max-width: 1000px) {
}

@media (max-width: 800px) {

    section#fnc_detail .fuc-box .item .flex-box{ display: block; }
    section#fnc_detail .fuc-box .item{ width: auto; }
    section#fnc_detail .fuc-box .item .a-block{ width: auto; }
    section#fnc_detail .fuc-box .item .flex-box .img{ width: auto; min-height: inherit; margin-bottom: 20px; max-width: none; margin-left: 0px; margin-right: auto; }
    section#fnc_detail .fuc-box .item .flex-box .img .a-block{ width: auto; }
    section#fnc_detail .fuc-box .item .flex-box .img img{ width: 100%; height: auto; }

    section#fnc_detail .fuc-box .item .flex-box .cont{ width: auto; }
    section#fnc_detail .fuc-box .item .flex-box .cont .a-block{ width: auto; }
    section#fnc_detail .fuc-box .item .flex-box .cont .inner{ width: auto; padding-left: 0px; padding-right: 0px; padding-bottom: 0px; max-width: none; margin: 0px; }
    section#fnc_detail .fuc-box .item .flex-box .cont ul li:before{ top: -3px; }
    section#fnc_detail .inner{ margin-left: 35px; margin-right: 35px; }


}

@media (max-width: 768px) {

    main article{ padding-top: 120px; padding-top: 0px; }

    main article .intro{ padding-bottom: 65px; padding-top: 120px; background-color: #fff; }
    main article .intro .inner{ padding-left:25px; padding-right: 25px; }

    main article .intro .inner>h1.copy{ text-align: left; /*font-size: 6vw;*/ font-size: 18px; padding-bottom: 20px;
    margin-bottom: 30px; }
    main article .intro .inner h1.copy br{ display: none; }

    main article .intro .inner p{ text-align: left; }
    main article .intro .inner p:nth-child(2){ text-align: center; }
    main article .intro .inner p br{ display: none; }

    #dl main article .intro .inner>p{ margin-bottom: 30px; }

    main article .intro .inner .logos{ width: 233px; margin-bottom: 30px; }
    main article .intro .inner .logos .n_logo{ margin-right: 0px; width: 90px; height: 28px; }
    main article .intro .inner .logos .n_logo:before{ width: 90px; height: 20px; background-size: auto; }
    main article .intro .inner .logos .n_logo:after{ width: 90px; height: 20px; background-size: auto; background-size: 100%; top: 8px; }


    main article .intro .inner .logos .s_logo{ float: right; width: 100px; height: 28px; }
    main article .intro .inner .logos .s_logo:before{ width: 100px; height: 28px; }
    main article .intro .inner .logos .s_logo:before{ width: 100px; height: 28px; background-size: auto; }
    main article .intro .inner .logos .s_logo:after{ width: 100px; height: 28px; background-size: auto; background-size: 100%; }

    main article .intro:before,
    main article .intro:after{ display: none; }

    section#about{ position: relative; z-index: 120; }
    section#about .inner{ padding-top: 0px; padding-bottom: 0px; margin-left: 0px; margin-right: 0px; }
    section#about .inner .nikkei{ width: 100%; border-top: solid 4px #00629d; padding-top: 65px; }

    section#about .inner .nikkei .n_logo{ margin-bottom: 45px; height: 32px; width: 143px; padding: 0px; display: inline-block; margin-left: auto; margin-right: auto; }
    section#about .inner .nikkei .n_logo a{ height: 32px; width: 143px; }
    section#about .inner .nikkei .n_logo a:before{ height: 32px; width: 143px; }
    section#about .inner .nikkei .n_logo a:after{ height: 32px; width: 143px; background-size: 100%; top: 0px; background-position:top 0px center;}
    section#about .inner .nikkei h2{ margin-bottom: 65px; font-size: 18px; display: inline-block; width: auto; padding-bottom: 6px; }

    section#about .inner .nikkei .ttl-box{ width: 50%; max-width: 150px; margin-left: auto; margin-right: auto; }

    section#about .inner .flex-box .txt-box{ text-align: left; }
    section#about .inner .flex-box .txt-box{ margin-left: 25px; margin-right: 25px; margin-bottom: 65px; }

    section#about .inner .slack{ width: 100%; border-top: solid 4px #63c1a0; padding-top: 65px; margin-left: 0; }
    section#about .inner .slack .s_logo{ margin-bottom: 45px; height: 32px; width: 143px; padding: 0px; display: inline-block; margin-left: auto; margin-right: auto; padding-right: 20px; }
    section#about .inner .slack .s_logo a{ height: 40px; width: 143px; }
    section#about .inner .slack .s_logo a:before{ height: 40px; width: 143px; }
    section#about .inner .slack .s_logo a:after{ height: 40px; width: 143px; background-size: 100%; top: 0px; background-position:top 0px center;}
    section#about .inner .slack h2{ margin-bottom: 65px; font-size: 18px; display: inline-block; width: auto; padding-bottom: 6px; }

    section#about .inner .slack .ttl-box{ width: 50%; max-width: 150px; margin-left: auto; margin-right: auto; text-align: center: }


    section#n_for_s .inner{ padding-left:25px; padding-right: 25px; margin-left: 0px; margin-right: 0px; }
    section#n_for_s .inner .a-block{ width: auto; }
    section#n_for_s .inner .a-block .hd h2{ width: auto; margin-bottom: 80px; }

    .flex-box{ display: block; }

    section#n_for_s{ padding-bottom: 0px; position: relative; z-index: 100; }
    section#n_for_s:before{ height: 95%; top: 120px; }

    section#n_for_s .inner h2{ font-size: 52px; /*font-size: 13vw;*/ line-height: 1.4em; color: #63c1a0; margin-bottom:65px; }
    section#n_for_s .inner h2 span{ display: block; font-size: 24px; line-height: 1em; letter-spacing: .3em; color: #333333; }

    section#n_for_s .inner .flex-box .lf .ttl h3{ font-size: 20px; }
    section#n_for_s .inner .flex-box .lf .ttl{ width: auto; margin-bottom: 20px; }
    section#n_for_s .inner .flex-box .lf .a-block{ width: auto; }

    section#n_for_s .inner .flex-box .lf{ width: auto; padding-right: 0px; }
    section#n_for_s .inner .flex-box .lf p{ margin-bottom: 30px; padding-right:  }
    section#n_for_s .inner .flex-box .lf img{ margin-left: auto; margin-right: auto; width: 100%; max-width: 400px; display: block; margin-bottom: 40px; }

    section#n_for_s .inner .flex-box .ri{ width: auto; }

    section#n_for_s .inner .flex-box .ri .ttl{ padding-left: 65px; }
    section#n_for_s .inner .flex-box .ri .txt{ padding-left: 65px; }

    section#n_for_s .inner .flex-box .ri .item{ padding-left: 65px; padding-left: 0px; width: auto; }
    section#n_for_s .inner .flex-box .ri .item i{ font-size: 40px; top:0px; }
    section#n_for_s .inner .flex-box .ri .item .ttl h4{ font-size: 20px; }


    section#n_for_s_function{ position: relative; z-index: 100; padding-bottom: 60px; margin-left: 0px; margin-right: 0px; }
    section#n_for_s_function .inner{ padding-bottom: 180px; margin-left: 0; margin-right: 0; }
    section#n_for_s_function:before{ height: 93%; top: -60px; }


    section#n_for_s_function .inner{ padding-left:25px; padding-right: 25px; }
    section#n_for_s_function .inner .hd{ width: 100%; }

    section#n_for_s_function .inner .hd h2{ text-align: right; font-size: 26px; line-height: 1.6em; margin-bottom: 30px; color: #e4e7eb; }
    section#n_for_s_function .inner .hd h2 i{ width: 26px; height: 24px; display: inline-block; position: relative; margin-left: 5px; }
    section#n_for_s_function .inner .hd h2 i:before{ content: ""; width: 26px; height: 24px; background-image: url("../img/Slack_Mark_Monochrome_White.c8e2fd1fa7e6.svg"); background-repeat: no-repeat; position: absolute; left: 0px; top: 0px; }
    section#n_for_s_function .inner .hd h2 span{ display: block; font-size: 32px; letter-spacing: 0.2em; }


    section#n_for_s_function .inner .flex-box .item{ width: auto; padding-bottom: 60px; margin-left: 0px; margin-right: 0px; }
    section#n_for_s_function .inner .flex-box .item:first-child{ margin-left: 0px; margin-right: 0px; }
    section#n_for_s_function .inner .flex-box .item:last-child{ margin-left: 0px; margin-right: 0px; }
    section#n_for_s_function .inner .flex-box .item h4{ min-height: auto; padding-bottom: 30px; }
    section#n_for_s_function .inner .flex-box .item p.t-left{ min-height: inherit; }
    section#n_for_s_function .inner .flex-box .item img{ width: 100%; max-width: none; margin-left: auto; margin-right: auto; display: block; height: auto; }
    section#n_for_s_function .inner .dl{ left: calc(50% - 80px); }

    section#n_for_s_function .inner .flex-box{}

    #dl main article .intro{ padding-top: 45px; }

    main article .intro .inner .denshiban{ width: auto; padding: 25px 25px; }
    main article .intro .inner .denshiban p a{ font-size: 16px; text-align: center; }
    main article .intro .inner .denshiban p:last-child{ text-align: center; }

    .photoarea{ position: relative; }
    /*.photoarea:before{ content: ""; display: none; position:fixed; right: 0px; top: 0px; background-image: url("../img/SP_PhotoArea_bg.fbb40b9b031a.png"); background-size: cover; height: 50%; width: 100%; z-index: -10; }
    .photoarea:after{ content: ""; display: none; position:fixed; right: 0px; bottom: 0px; background-image: url("../img/SP_PhotoArea_bg2.c7697bdb66c2.png"); background-size: cover; height: 50%; width: 100%; z-index: -10; }
    .photoarea .robo:before{ content: ""; display: none; position:fixed; right: 0px; top: 0px; background-image: url("../img/PhotoArea_bg2.f36b5139b079.png"); height: 50%; width: 100%; }

    .photoarea .robo{ position: absolute; left: 0; top: 35%; height: 100%; width: 100%; display: block; background-image: url("../img/PhotoArea.816ee65b31bd.png"); background-position: center; background-size: 120%; background-repeat: no-repeat; z-index: 1; }
    .photoarea .robo img{ display: block; margin-left: auto; margin-right: auto; position: relative; width: 120%; margin-left: -10%; margin-top: -10%; display: block; }*/

    .photoarea .robo:before{ content: ""; display: none; position:absolute; left: 0px; top: calc(50% - ( 1977px / 2 )); background-image: url("../img/PhotoArea_bg.16c33085f733.png"); background-size: auto; height: 1977px; width: 50%; z-index:0; }
    .photoarea:after{ content: ""; display: none; position:fixed; right: 0px; top: calc(50% - ( 1977px / 2 )); background-image: url("../img/PhotoArea_bg2.f36b5139b079.png"); background-size: cover; height: 876px; width: 50%; z-index: -10; }
    .photoarea .robo{ position: absolute; left: 0; top:calc(50% - 27%); height: 30%; width: 100%; display: block; background-image: url("../img/PhotoArea.816ee65b31bd.png"); background-size:cover; background-repeat: no-repeat; background-position: center;  z-index: 0; overflow: hidden; }
    .photoarea .robo img{ display: none; margin-left: auto; margin-right: auto; position: relative; }

    .botlink{ /*width: auto;*/ max-width: 350px; margin-left: auto; margin-right: auto; margin-bottom: 35px; }
    .botlink a{ display: block; border-radius: 10px; background-color: #fff; /*box-shadow: 0px 0px 9.3px 0.7px rgba(0, 0, 0, 0.2); padding:0;*/ text-align: center; }
    /*.botlink a p.ttl{ font-size: 20px; }
    .botlink a p.txt{ font-size: 12px; }
    .botlink a i.slack{ display: inline-block; width: 28px; height: 20px; margin-right: 15px;  }
    .botlink a i.slack:before{ content: ""; display: inline-block; width: 28px; height: 28px; margin-right: 15px; background-repeat: no-repeat; background-position: center; top:-1px; }*/

    section#fnc_detail{ padding-top: 40px; position: relative; z-index: 100; }
    section#fnc_detail .hd{ padding-bottom: 55px; }
    section#fnc_detail .hd h2{ font-size: 30px; }
    section#fnc_detail .inner{ padding-left:0px; padding-right: 0px; padding-bottom: 0px; /*margin-left: 0; margin-right: 0;*/ }

    section#fnc_detail .fuc-box .item .ttl{ padding-top: 4px; width: auto; }
    section#fnc_detail .fuc-box .item .ttl i{ width: 100px; height: 135px; margin-right: 20px; }

    section#fnc_detail .fuc-box .item .ttl i.ico_dl01:before,
    section#fnc_detail .fuc-box .item .ttl i.ico_dl02:before,
    section#fnc_detail .fuc-box .item .ttl i.ico_dl03:before,
    section#fnc_detail .fuc-box .item .ttl i.ico_dl04:before{ width: 100px; height: 125px; background-size: 100%; background-repeat: no-repeat; top: 0px; }

    section#fnc_detail .fuc-box .item .ttl .txt-box h3 i.ico_update{ width: auto; font-size: 12px; padding: 4px 10px; top: 4px;  }
    section#fnc_detail .fuc-box #detail04.item .ttl .txt-box h3 i.ico_new{ width: auto; font-size: 12px; padding: 4px 10px; top: 4px; }

    section#fnc_detail .fuc-box .item .ttl .txt-box h3{ font-size: 20px; line-height: 1.6em; margin-bottom: 5px; }


    section#fnc_detail .fuc-box .item .ttl .txt-box p{ font-size: 16px; }
    section#fnc_detail .fuc-box .item .ttl .txt-box p br{ display: none; }

    section#fnc_detail .fuc-box .item .flex-box .img{ width: auto; min-height: inherit; margin-bottom: 20px; max-width: none; margin-left: auto; margin-right: auto; }
    section#fnc_detail .fuc-box .item .flex-box .img img{ width: 100%; height: auto; }

    section#fnc_detail .fuc-box .item .flex-box .cont{ width: auto; }

    section#fnc_detail .fuc-box .item{ padding-bottom: 55px; }

    section#install .inner{ padding-left:25px; padding-right: 25px; }
    section#install .inner .cont .img img{ width: 100%; height: auto; }

    section#other .inner{ padding-left:25px; padding-right: 25px; padding-bottom: 60px; }
    section#other .robot{ content: ""; display: block; width: 140px; height: 151px; background-image: url("../img/ROBO.eba70fee7e98.png"); background-repeat: no-repeat; background-size: 140px auto; right: calc(50% - 85px); top: -86px; position: absolute; }
    section#other:after{ width: 150px; height: 173px; background-size: 100%; right: calc(50% - 95px); top: -86px; }

    section#other .inner .cont>p{ font-size: 13px; line-height: 1.8em; }


    section#install .inner h2{ font-size: 26px; }
    section#install .inner .cont p{ font-size: 16px; line-height: 1.6em; }
    section#install .inner .cont p br{ display: none; }
    section#install .inner .cont .img{ max-width: 700px; margin-left: auto; margin-right: auto; }
}

@media (max-width: 640px) {

    section#n_for_s:before {
        height: 95%;
        top: 120px;
    }
    section#n_for_s .inner .a-block .hd{ width: auto; }
    section#n_for_s .inner .a-block .hd h2{ font-size: 11vw; margin-bottom: 80px; }
    section#n_for_s .inner .a-block .hd h2 span{ font-size: 4.3vw; letter-spacing: .05em; }

    section#n_for_s .inner .flex-box .ri .a-block{ width: auto; }
    section#n_for_s .inner .flex-box .ri .item{ box-sizing: border-box; }

    section#n_for_s_function{ padding-bottom: 20px; }
    section#n_for_s_function:before{ height: 97%; top: -40px; }
    section#n_for_s_function .inner{ padding-bottom: 160px; }

    section#n_for_s_function .inner .dl{ bottom: 30px; }
    section#fnc_detail .fuc-box .item .ttl .txt-box{ display: block; }
    section#fnc_detail .fuc-box .item .ttl .txt-box p{ font-size: 12px; }

    .photoarea .robo{ position: absolute; left: 0; top:calc(50% - 22%); height: 30%; width: 100%; display: block; background-image: url("../img/PhotoArea.816ee65b31bd.png"); background-size:cover; background-repeat: no-repeat; background-position: center;  z-index: 0; overflow: hidden; }

    section#other .inner .cont{ padding: 30px 0; }
}

@media (max-width: 375px) {
    .photoarea .robo{ position: absolute; left: 0; top:calc(50% - 21%); height: 30%; width: 100%; display: block; background-image: url("../img/PhotoArea.816ee65b31bd.png"); background-size:cover; background-repeat: no-repeat; background-position: center;  z-index: 0; overflow: hidden; }
}

@media (max-width: 320px) {
    .photoarea .robo{ position: absolute; left: 0; top:calc(50% - 17%); height: 30%; width: 100%; display: block; background-image: url("../img/PhotoArea.816ee65b31bd.png"); background-size:cover; background-repeat: no-repeat; background-position: center;  z-index: 0; overflow: hidden; }
}
