@charset "UTF-8";

@import url(base.css);
@import url(color.css);

img {
	display: inline-block;
	max-width:100%;
	max-height: 100%;}

html {
    scroll-padding-top: 16vh; /* 固定ヘッダの高さ分 */}

p {
	font-size: 3.5vw;}

.pc,.pc845 {
	display: none !important;}

.img100 {
	width: 100%;
	height: auto;}
.img70 {
	width: 70%;
	height: auto;}
.img50 {
	width: 50%;
	height: auto;}
.img30 {
	width: 30%;
	height: auto;}

/*-------------------------------------------------
	++ BANNER
-------------------------------------------------*/
.Top_Banner {
	display: none;}

/*-------------------------------------------------
	++ OUTER
-------------------------------------------------*/
#container {
	margin:0 auto;
	text-align: center;
	position:relative;
	min-width:100%;}
.cInner,
.cInner2 {
	display:block;
	clear:both;
	margin:0 auto;
	text-align: left;
	position:relative;
	padding:6vw 2vw;}

/*-------------------------------------------------
	++ HEADER
-------------------------------------------------*/
#header {
	position:fixed;
	top:0;
	left:0;
	z-index:9998;
	width:100%;
	height: 16vh;
	-webkit-overflow-scrolling : touch;
    background-color: #ffffff;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    flex-direction: row;
    flex-wrap: wrap;}

#logo {
    order: 1;
    width: 30%;
    margin-top: 0.5vw;}
#snsArea {
    order: 3;
    width: 100%;}
#snsArea ul {
	display: flex;
    align-items: center;
    flex-direction: row;}
#snsArea li {
	text-align: center;
	margin: 0 5px;
	display: inline-block;
	vertical-align: middle;}
#snsArea li.tel {
    width: 42%;}
#snsArea li.mail,
#snsArea li.icon {
    width: 11%;}
#snsArea li.Partner {
    width: 25%;}

#fullscreenmenu {
    order: 2;
    width: 20vw;
    height: 15vw;}
#nav-toggle {
    position: fixed;
    top: 4vw;
    right: 5vw;
    height: 10vw;
    width: 10vw;
    cursor: pointer;}
#nav-toggle > div {
    position: relative;
    width: 10vw;}
#nav-toggle span {
    width: 100%;
    height: 1px;
    left: 0;
    display: block;
    background: #FFFFFF;
    position: absolute;
    transition: transform 0.6s ease-in-out, top 0.5s ease;}
#nav-toggle span:nth-child(1) {
    top: 0;}
#nav-toggle span:nth-child(2) {
    top: 13px;}
#nav-toggle span:nth-child(3) {
    top: 27px;}

.open #nav-toggle span {
    background: #FFFFFF;}
.open #nav-toggle span:nth-child(1) {
    top: 13px;
    transform: rotate(45deg);}
.open #nav-toggle span:nth-child(2) {
    top: 14px;
    width: 0;
    left: 50%;}
.open #nav-toggle span:nth-child(3) {
    top: 13px;
    transform: rotate(-45deg);}

#gloval-nav {
    position: fixed;
    top: 16vh;
    left: 0;
    right: 0;
    bottom: 10vh;
    padding: 3% 3% 10% 3%;
    font-size: 20px;
    transform: translateX(-100%);
    transition: opacity 0.6s ease, visibility 0.6s ease;
    overflow: hidden;
    overflow-y: scroll;}
#gloval-nav a {
    display: block;
    color: #fff;
    padding: 8px 0;
    transition: color 0.6s ease;}
#gloval-nav ul li {
    opacity: 0;
    transform: translateX(0px);
    transition: transform 0.6s ease, opacity 0.2s ease;}

/* open */
.open {
    overflow: hidden;}
.open #gloval-nav {
    visibility: visible;
    transform: translateX(0);
    transition: transform 0.6s;}
.open #gloval-nav li {
    width: 100%;
    margin: 0;
    display: inline-block;
    vertical-align: top;
    text-align: left;
    opacity: 1;}
.sub_list {
    width: 100%;
    margin: 0;}
.sub_list a {
    justify-content: flex-start;
    align-items: center;
    font-size: 4vw;
    font-weight: 500;
    letter-spacing: 0.1em;
    color: #000;
    padding: 0;
    background: url("../../../images/2022/addon/icon_arrowW.svg") no-repeat right 10px center;
    background-size: 2%;
    border-bottom: solid 1px rgba(255,255,255,0.8);}
.sub_list a.link {
    background: url("../../../images/2022/addon/icon_Link.svg") no-repeat right 10px center;
    background-size: 4%;}
.sub_list a:link,.sub_list a:visited {color:#ffffff;text-decoration:none;}
.sub_list a:hover,.sub_list a:active {color:#ffffff;text-decoration:none;}

#nav-toggle {
    z-index: 100;}
#gloval-nav {
    z-index: 10;}

/*-------------------------------------------------
	++ HEADER
-------------------------------------------------*/
#header2024 {
	position:fixed;
	top:0;
	left:0;
	z-index:9998;
	width:100%;
	height: 16vh;
	-webkit-overflow-scrolling : touch;
    background-color: #ffffff;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    flex-direction: row;
    flex-wrap: wrap;}
.headerInner2024 {
    display: contents;}

#logo2024 {
    order: 1;
    width: 30%;
    margin-top: 1vw;
    margin-left: 1vw;}
#snsArea2024 {
    order: 3;
    width: 100%;}
#snsArea2024 ul {
	display: flex;
    align-items: center;
    flex-direction: row;}
#snsArea2024 li {
	text-align: center;
	margin: 0 5px;
	display: inline-block;
	vertical-align: middle;}
#snsArea2024 li.tel {
    width: 42%;}
#snsArea2024 li.mail,
#snsArea2024 li.icon {
    width: 11%;}
#snsArea2024 li.Partner {
    width: 25%;}

#pcMenu2024 {
    display: none;}

#fullscreenmenu2024 {
    order: 2;
    width: 20vw;
    height: 15vw;}
#nav-toggle2024 {
    position: fixed;
    top: 4vw;
    right: 5vw;
    height: 10vw;
    width: 10vw;
    cursor: pointer;}
#nav-toggle2024 > div {
    position: relative;
    width: 10vw;}
#nav-toggle2024 span {
    width: 100%;
    height: 1px;
    left: 0;
    display: block;
    background: #FFFFFF;
    position: absolute;
    transition: transform 0.6s ease-in-out, top 0.5s ease;}
#nav-toggle2024 span:nth-child(1) {
    top: 0;}
#nav-toggle2024 span:nth-child(2) {
    top: 13px;}
#nav-toggle2024 span:nth-child(3) {
    top: 27px;}

.open #nav-toggle2024 span {
    background: #FFFFFF;}
.open #nav-toggle2024 span:nth-child(1) {
    top: 13px;
    transform: rotate(45deg);}
.open #nav-toggle2024 span:nth-child(2) {
    top: 14px;
    width: 0;
    left: 50%;}
.open #nav-toggle2024 span:nth-child(3) {
    top: 13px;
    transform: rotate(-45deg);}

#gloval-nav2024 {
    position: fixed;
    top: 16vh;
    left: 0;
    right: 0;
    bottom: 10vh;
    padding: 3% 3% 10% 3%;
    font-size: 20px;
    transform: translateX(-100%);
    transition: opacity 0.6s ease, visibility 0.6s ease;
    overflow: hidden;
    overflow-y: scroll;}
#gloval-nav2024 a {
    display: block;
    color: #fff;
    padding: 8px 0;
    transition: color 0.6s ease;}
#gloval-nav2024 ul li {
    opacity: 0;
    transform: translateX(0px);
    transition: transform 0.6s ease, opacity 0.2s ease;}

/* open */
.open {
    overflow: hidden;}
.open #gloval-nav2024 {
    visibility: visible;
    transform: translateX(0);
    transition: transform 0.6s;}
.open #gloval-nav2024 li {
    width: 100%;
    margin: 0;
    display: inline-block;
    vertical-align: top;
    text-align: left;
    opacity: 1;}
.sub_list2024 {
    width: 100%;
    margin: 0;}
.sub_list2024 a {
    justify-content: flex-start;
    align-items: center;
    font-size: 4vw;
    font-weight: 500;
    letter-spacing: 0.1em;
    color: #000;
    padding: 0;
    background: url("../../../images/2022/addon/icon_arrowW.svg") no-repeat right 10px center;
    background-size: 2%;
    border-bottom: solid 1px rgba(255,255,255,0.8);}
.sub_list22024 {
    width: 100%;
    margin: 0;
    text-indent: 1em;}
.sub_list22024 a {
    justify-content: flex-start;
    align-items: center;
    font-size: 3.5vw;
    font-weight: 500;
    letter-spacing: 0.1em;
    color: #000;
    padding: 0;
    background: url("../../../images/2022/addon/icon_arrowW.svg") no-repeat right 10px center;
    background-size: 2%;
    border-bottom: solid 1px rgba(255,255,255,0.8);}
.sub_list2024 a.link {
    background: url("../../../images/2022/addon/icon_Link.svg") no-repeat right 10px center;
    background-size: 4%;}
.sub_list2024 a:link,.sub_list2024 a:visited,.sub_list2024 a:link,.sub_list2024 a:visited {color:#ffffff;text-decoration:none;}
.sub_list2024 a:hover,.sub_list2024 a:active,.sub_list2024 a:hover,.sub_list2024 a:active {color:#ffffff;text-decoration:none;}

#nav-toggle2024 {
    z-index: 100;}
#gloval-nav2024 {
    z-index: 10;}

/*-------------------------------------------------
	++ title
-------------------------------------------------*/
#title {
	width: 100%;
    padding-bottom: 30%;
    position: relative;}
.Microsoft365_SSO { background: url(../../../images/2022/addon/sso_main.jpg) no-repeat center bottom/ cover;}
.Cloud_file_server { background: url(../../../images/2022/addon/Cloud_file_server_main.jpg) no-repeat center bottom/ cover;}
.Microsoft365_Clientcertificate { background: url(../../../images/2022/addon/Clientcertificate_main.jpg) no-repeat center bottom/ cover;}
.Microsoft365_Browser { background: url(../../../images/2022/addon/Browser_main.jpg) no-repeat center bottom/ cover;}
.Microsoft365_Database { background: url(../../../images/2022/addon/Database_main.jpg) no-repeat center bottom/ cover;}
.Microsoft365_Workflow { background: url(../../../images/2022/addon/Workflow_main.jpg) no-repeat center bottom/ cover;}
.Microsoft365_Calendar { background: url(../../../images/2022/addon/Calendar_main.jpg) no-repeat center bottom/ cover;}
.Microsoft365_Address { background: url(../../../images/2022/addon/Address_main.jpg) no-repeat center bottom/ cover;}
.Microsoft365_bbs { background: url(../../../images/2022/addon/bbs_main.jpg) no-repeat center bottom/ cover;}
.Microsoft365_Document { background: url(../../../images/2022/addon/Document_main.jpg) no-repeat center bottom/ cover;}
.Microsoft365_MyPortal_Gadget { background: url(../../../images/2022/addon/MyPortal_Gadget_main.jpg) no-repeat center bottom/ cover;}
.Microsoft365_Memo { background: url(../../../images/2022/addon/Memo_main.jpg) no-repeat center bottom/ cover;}
.Microsoft365_Kintaikanri_taimukado { background: url(../../../images/2022/addon/Kintaikanri_taimukado_main.jpg) no-repeat center bottom/ cover;}
.Microsoft365_CRM { background: url(../../../images/2022/addon/CRM_main.jpg) no-repeat center bottom/ cover;}
.Microsoft365_Anpi { background: url(../../../images/2022/addon/Anpi_main.jpg) no-repeat center bottom/ cover;}
.Microsoft365_Fairutenso { background: url(../../../images/2022/addon/Fairutenso_main.jpg) no-repeat center bottom/ cover;}
.Microsoft365_MapDB { background: url(../../../images/2022/addon/MapDB_main.jpg) no-repeat center bottom/ cover;}
.Microsoft365_Form { background: url(../../../images/2022/addon/Form_main.jpg) no-repeat center bottom/ cover;}
.Microsoft365_Browserswith { background: url(../../../images/2022/addon/Browserswith_main.jpg) no-repeat center bottom/ cover;}
.Microsoft365_QAChatbot { background: url(../../../images/2022/addon/Q&AChatbot_main.jpg) no-repeat center bottom/ cover;}
.Microsoft365_ELearning { background: url(../../../images/2022/addon/ELearning_main.jpg) no-repeat center bottom/ cover;}
.Microsoft365_TatempoKanri { background: url(../../../images/2022/addon/TatempoKanri_main.jpg) no-repeat center bottom/ cover;}
.Microsoft365_cloud_tel { background: url(../../../images/2022/addon/cloud_tel_main.jpg) no-repeat center bottom/ cover;}
.Microsoft365_ThanksCard { background: url(../../../images/2022/addon/ThanksCard_main.jpg) no-repeat center bottom/ cover;}

.titleBox {
    width:100%;
    margin: 0 auto;
    position: relative;}
h2 {
    text-align: center;
    margin: 0 auto;
    padding-top: 2.5em;
    color: #FFFFFF;
    font-size: 8vw;
    line-height: 1.2em;
    text-shadow: 1px 1px 5px #595959, -1px 1px 5px #595959, 1px -1px 5px #595959, -1px -1px 5px #595959;}
h2 span {
    font-size: 5vw;
    display: block;}
h2 em {
    font-size: 4vw;
    line-height: 1.3em;
    padding-bottom: 0.3em;
    display: block;}
.title_icon {
    width: 18%;
    position: absolute;
    top: 5px;
    left: 5px;}
.title_icon2 {
    width: 18%;
    position: absolute;
    top: 5px;
    left: 23%;}
.title_iconBest {
    width: 21%;
    position: absolute;
    top: 5px;
    left: 0;}
.dairiten {
    width: 30%;
    position: absolute;
    top: 0;
    right: 0;}
.install {
    display: none;}
.patent {
    position: absolute;
    bottom: 20px;
    left: 0;
    right: 0;
    background-color: #FFFFFF;
    border-radius: 30px;
    padding: 5px 30px;
    display: inline-table;
    text-align: center;
    margin: 0 auto;}

/*-------------------------------------------------
	++ SLIDER
-------------------------------------------------*/
#functionSlider {
    width: 100%;
    margin: 0 auto;}
.slider img {
	width:100%;
	height:60vw;
    margin-bottom: 5px;}
.slider li {
	position:relative;}

.slick-prev,
.slick-next {
    position: absolute;
    top: 35%;
	left:50%;
    display: block;
    width: 34px;
    height: 58px;
	margin-top:0px;
    padding: 0;
    cursor: pointer;
    color: transparent;
    border: none;
    outline: none;
    background: transparent;
	z-index: 9;}
.slick-prev {
    background: url(../../../images/2022/addon/icon_arrowGL.svg) center center no-repeat;
    background-size: 65%;
	margin-left:-50%;}
.slick-next {
    background: url(../../../images/2022/addon/icon_arrowGR.svg) center center no-repeat;
    background-size: 65%;
	margin-left:42%;}

.slick-dots {
    display: block;
    width: 100%;
    padding: 5px 0 8px 0;
    margin: 0;
    list-style: none;
    text-align: center;}
.slick-dots li {
    position: relative;
    display: inline-block;
    width: 10px;
    height: 10px;
    margin: 0 5px;
    padding: 0;
    cursor: pointer;
	background-color: #999999;
    border-radius: 10px;
    opacity:0.8;}
.slick-dots li button {
    font-size: 0;
    line-height: 0;
    display: block;
    width: 10px;
    height: 10px;
    padding: 5px;
    cursor: pointer;
    color: transparent;
    border: 0;
    outline: none;
    background: transparent;
	background-color: #e0e0e0;
    border-radius: 10px;}
.slick-dots li.slick-active {
	background-color:#999999;}
.slick-dots li.slick-active button {
	background-color:#999999;}

.inlineBox {
	width: 100%;
    padding: 2% 0;
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: space-between;
	margin: 0 auto;}
.inlineBox li {
    width: 48%;
	margin: 0 0 20px 0;
    padding: 0;}
.inlineBox li span {
    text-align: left;
    font-size: 3.2vw;
    line-height: 1.3em;}
.inlineBox li img {
    width: 100%;}

.tabs {
    margin-top: 0px;
    padding-bottom: 0px;
    width: 100%;
    margin: 0 auto;}
.tab_item {
    width: calc(98%/2);
    background-color: #d9d9d9;
    line-height: 3em;
    font-size: 3vw;
    text-align: center;
    color: #565656;
    display: block;
    float: left;
    margin-right: 1%;
    text-align: center;
    font-weight: normal;
    transition: all 0.2s ease;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;}}
.tab_item:hover {
    opacity: 0.9;}
input[name="tab_item"] {
    display: none;}
.tab_content {
    display: none;
    padding: 0;
    clear: both;
    overflow: hidden;}
#list:checked ~ #list_content,
#slide:checked ~ #slide_content {
    display: block;}
.tabs input:checked + .tab_item {
    color: #fff;}



/*-------------------------------------------------
	++ others
-------------------------------------------------*/
.starBox {
    width: 100%;
    background-color: #ffffe2;
    border-radius: 40px;
    padding: 10px 20px;
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    font-size: 3.8vw;
    font-weight: bold;
    color: #07913b;
    margin-bottom: 10px;}
.star {
    color: #ffae00;
    font-size: 5vw;
    padding-right: 0.2em;
    line-height: 1em;}

.WhatsNewBox{
    width: 100%;
    background-color: #ffffe2;
    border-radius: 20px;
    padding: 15px 20px;
    margin: 10px 0;
    display: flex;
    align-items: flex-start;
    flex-wrap: wrap;}
.WhatsNewBox h4 {
    width: 100%;
    color: #FF0000 !important;
    font-size: 110%;
    padding: 0 0 5px 0;}
.WhatsNewTxt {
    width: 100%;
    padding-bottom: 0.5em;}
.WhatsNewTxt p {
    font-size: 3.8vw;
    line-height: 1.7em;
    padding: 0;
    margin-left: 0.8em;
    text-indent: -0.8em;}
.WhatsNewTxt p span {
    display: inline-block;
    color: #ffae00;
    font-size: 4.5vw;
    padding-right: 0.2em;
    line-height: 1em;}

.serviceBox {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 10px;}
.serviceIcon {
    display: none}
.serviceTxt {
    width: 100%;}

.introductionBox {
    width: 100%;
    border: 1px #cccccc solid;
    background-color: #ffffee;
    text-align: left;
    padding: 15px 10px;
    margin-top: 30px;
    color: #07913b;
    font-weight: bold;
    font-size: 4.2vw;
	line-height: 1.5em;}

.installBtn, .btnBoxTI, .privacyIT {display: none;}

/* リンクグリーン */
.starBox a:link,.starBox a:visited,
.introductionBox a:link,.introductionBox a:visited {color:#07913b;text-decoration:underline;}
.starBox a:hover,.starBox a:active,
.introductionBox a:hover,.introductionBox a:active {color:#02b044;text-decoration:none;}

.btnBox {
    width: 100%;
    margin: 30px auto 5px auto;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;}
	.btnBox2,
.btnBox3 {
    width: 100%;
    margin: 0px auto;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;}
.btnItem {
    border-radius: 20px;
    width: 49%;
		font-size: 3.3vw;
	margin: 5px 0 5px 0;}
	.btnItem2,
.btnItem5	{
    border-radius: 30px;
    width: 49%;
    font-size: 2.7vw;
    margin-bottom: 5px;}
.btnItem3,
.btnItem4 {
    border-radius: 30px;
    width: 100%;
    font-size: 3vw;
    margin-bottom: 5px;}
.btnItemGreen {
    border-radius: 20px;
    width: 100%;
    font-size: 3.7vw;
    margin-bottom: 5px;
    background-color: #07913b;}
	.btnItem a,
		.btnItem2 a,
.btnItem5 a {
    width: 100%;
    display: block;
    text-align: center;
    font-weight: 500;
    letter-spacing: 0.1em;
    color: #FFFFFF;
    padding: 8px 0;
    background: url("../../../images/2022/addon/icon_Link.svg") no-repeat right 15px center;
    background-size: 7%;}
.btnItem3 a,
.btnItem4 a,
.btnItemGreen a {
    width: 100%;
    display: block;
    text-align: center;
    font-weight: 500;
    letter-spacing: 0.1em;
    color: #FFFFFF;
    padding: 8px 0;
    background: url("../../../images/2022/addon/icon_Link.svg") no-repeat right 15px center;
    background-size: 3%;}
.btnItem a:link,.btnItem a:visited,.btnItem2 a:link,.btnItem2 a:visited,.btnItem3 a:link,.btnItem3 a:visited,.btnItem4 a:link,.btnItem4 a:visited,.btnItemGreen a:link,.btnItemGreen a:visited,.btnItem5 a:link,.btnItem5 a:visited{text-decoration:none;}

/* youtube/pdf */
.youtubeBox {
	width:100%;
	text-align:left;
	margin:0px auto 10vw auto;}
.youtube {
	position:relative;
	padding-top:56.25%;
	overflow: hidden;
	border:5px #DBDBDB solid;
	margin:5px 0px;}
.youtube iframe {
	position:absolute;
	top:0;
	right:0;
	left:0;
	width:100%;
	height:100%;}
.BtnPDF {
    width: 100%;
    margin: 20px auto;
    text-align: center;}

.movieBtn {
	margin: 0 auto;
	text-align: center;}
.movieBtn li {
	display: block;
	width: 90%;
	border-radius: 5px;
	background-color: #eb3d00;
	margin: 0 auto 10px auto;
	text-align: center;
	color: #FFFFFF;
	font-size: 4.0625vw;
	font-weight: bold;
	line-height: 1.5em;
	padding: 15px 0;}
.movieBtn li.detail {
	background-color: #eb8a00;}
.movieBtn li:last-child {
    margin-right: auto;}
.movieBtn li a {
	color: #FFFFFF;
	display: block;}

.pdfBtn {
	width:100%;
	border-radius: 10px;
	padding:0;
	margin:0px 0px 10px 0px;
	text-align:center;
	font-size:4.5vw;
	font-weight:bold;
	color:#FFFFFF;
	line-height:3em;}
.manualBtn {
	width:100%;
	border-radius: 10px;
	padding:2% 0;;
	text-align:center;
	font-size:4vw;
	font-weight:bold;
	color:#FFFFFF;
	background-color:#FF6C00;
	line-height:1.5em;
	margin:0px auto;}
.pdfBtn a,
.manualBtn a {
	color:#FFFFFF;
	display:block;}
.pdfBtn a:link,.pdfBtn a:visited,
.manualBtn a:link,.manualBtn a:visited {color:#FFFFFF;text-decoration:none;}
.pdfBtn a:hover,.pdfBtn a:active,
.manualBtn a:hover,.manualBtn a:active {color:#FFFFFF;text-decoration:none;}

/* Q&A */
.qaContainer dt {
	padding: 10px 10px 10px 15px;
    color: #FFFFFF;
    font-weight: bold;
    font-size: 4vw;
    line-height: 1.5em;}
.qaContainer dd {
	margin: 10px 0px 30px 0px;
    font-weight: normal;
    font-size: 3.8vw;
    line-height: 1.5em;}

/* 提供方法/マニュアル */
.offercInner {
	display:block;
	clear:both;
	margin:0;
	text-align: left;
	position:relative;
	padding:6vw 2vw;}
.offerItem {
    width: 100%;
    border-radius: 15px;
    border: 2px #ffad00 solid;
    background-color: #ffffe2;
    margin-bottom: 10px;}
.offerBoxTtl {
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #ffad00;
    text-align: center;
    color: #FFFFFF;
    font-size: 4vw;
    font-weight: bold;
    line-height: 2em;
    border-radius: 10px 10px 0px 0px;}
.offerBoxInner {
    padding: 20px 10px;}

.listDisc,
.listDiscG {
	margin:0;}
.listDisc li {
	text-align: left;
	line-height: 1.5em;
	list-style-type:none;
	padding: 0 0 0 1.0em;
	text-indent: -1.0em;}
.listDiscG li {
	text-align: left;
    color:#07913b;
    font-size: 3.8vw;
    font-weight: bold;
	line-height: 1.5em;
	list-style-type:none;
	padding: 0 0 0.1em 1.0em;
	text-indent: -1.0em;}
.listDisc li.mb10 {
    margin-bottom: 10px;}
.listDiscG li.mb30 {
    margin-bottom: 30px;}
.listDiscG li span.normal {
    font-weight: normal;}
.listDiscGImg {
    display: block;
    margin: 5px auto 30px auto;
    text-align: center;}
.listDiscG li a:link,.listDiscG li a:visited {color:#07913b;text-decoration:underline;}
.listDiscG li a:hover,.listDiscG li a:active {color:#02b044;text-decoration:none;}

.new {
    background-color: #FF0000;
    text-align: center;
    font-weight: normal;
    color: #FFFFFF;
    padding: 1px 1.0em;
    font-size: 3vw;
    line-height: 1.3em;
    margin-right: 5px;
    text-indent: -1.0em;}
.development {
    background-color: #878787;
    text-align: center;
    font-weight: normal;
    color: #FFFFFF;
    padding: 1px 1.0em;
    font-size: 3vw;
    line-height: 1.5em;
    margin-right: 5px;
    text-indent: -1.0em;}

/*-------------------------------------------------
	++ FOOTER
-------------------------------------------------*/
#footer{
    margin: 0px;
	padding: 30px 0 15vh 0;
	font-size:3.1vw;
	color: #FFFFFF;
	text-align: center;}}
#footer .cInner {
	position:relative;
	color: #FFFFFF;
	text-align: center;}
#footer a:link,#footer a:visited {color:#FFFFFF;text-decoration:none;}
#footer a:hover,#footer a:active {color:#FFFFFF;text-decoration:none;}

#InstallBox,
#InstallBox2 {
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 8vh;
    background-color: #ffad00;
	z-index:9998;}
.InstallBoxInner,
.InstallBox2Inner {
    position: relative;
    width: 100%;
    margin: 0 auto;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;}
.InstallBoxInner::after,
.InstallBox2Inner::after {
    content: '';
    position: absolute;
    display: block;
    width: 0;
    height: 0;
    border-radius: 50%;
    transform: rotate(45deg);
    left: 0px;
    top: -10vw;
    border-left: 20vw solid #ffad00;
    border-top: 20vw solid #ffad00;
    border-right: 10vw solid transparent;
    border-bottom: 10vw solid transparent;
    z-index: 1;}
.InstallBoxInner p.txtS,
.InstallBox2Inner p.txtS {
    display: none;}

.InstallIcon,
.InstallSerifu,
.InstallIcon2,
.InstallSerifu2 {
    display: none;}
.InstallTxt,
.InstallTxt2 {
    order: 2;
    width: 65%;
    height: 8vh;
    display: flex;
    align-items: center;
    justify-content: flex-start;}
.InstallTxt p,
.InstallTxt2 p {
    font-size: 140%;
    color: #FFFFFF;
    font-weight: bold;
    line-height: 1.4em;}
.InstallTxt p span,
.InstallTxt p span.txtS,
.InstallTxt p em,
.InstallTxt2 p span,
.InstallTxt2 p span.txtS,
.InstallTxt2 p em {
    display: none;}
.InstallWoman,
.InstallWoman2 {
    order: 1;
    width: 25%;
    margin-left: 2%;
    margin-top: -9vw;
    z-index: 2;}
.InstallWoman img,
.InstallWoman2 img {
    width: 100%;}
@media screen and (max-width: 375px) {
.InstallWoman,
.InstallWoman2 {
    margin-top: -7vw;}
}
.InstallBoxInner a.link,
.InstallBox2Inner a.link {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    text-indent: 100%;
    white-space: nowrap;
    overflow: hidden;
    z-index: 99999;}

#pageTop {
	position: fixed;
	bottom: 0;
  	right: 0;
  	width: 15%;
	z-index:9998;}
#pageTop img {
	display:block;}

.BtnLink {
	display: block;
  	text-align: left;
  	border-radius: 5px;}
.BtnLink a {
    display: inline-block;
	position: relative;
	padding-left: 15px;}
.BtnLink a::before {
	content: "";
  	position: absolute;
  	top: 50%;
  	left: 0;
  	width: 9px;
  	height: 9px;
  	transform: rotate(45deg);
  	margin-top: -5px;}


/*-------------------------------------------------
	++ google_workspace
-------------------------------------------------*/
#title_gw {
	width: 100%;
    position: relative;}
.titleBox_gw {
    width:100%;
    margin: 0 auto;
    padding: 18vh 0 0 0;
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    flex-wrap: wrap;}

.titleBox_gwIcon {
    order: 1;
    width: 65%;
    margin: 0;
    margin-left: 2%;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;}
.titleBox_gwIcon img {
    width: 45%;}
.titleBox_gwIcon2 {
    order: 2;
    width: 26%;
    margin: 0 2% 0 5%;}
.titleBox_gwIcon2 img {
    width: 100%;}
.titleBox_gwTxt {
    order: 3;
    width: 100%;}
h2.google_workspace {
    width: 100%;
    padding: 0;
    color: #606368;
    font-size: 5vw;
    font-weight: bold;
    line-height: 1.5em;
    text-shadow: none;}
h2.google_workspace span {
    display: block;}
h2.google_workspace img {
    width: 95%;
    margin: 2% auto;}

.gwIconList {
    width: 90%;
    margin: 4% auto;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;}
.gwIconListL {
    width: 100%;
    margin: 2% auto 4% auto;
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;}
.gwIconList li {
    width: 13%;
    margin: 0 auto;
    text-align: center;}
.gwIconList li img {
    width: 100%;}
.gwIconListL li {
    width: 15%;
    margin: 0 auto 10px auto;
    text-align: center;}
.gwIconListL li span {
    font-size: 80%;
    padding: 0;
    margin: 0;
    display: block;}
.gwIconListL li img {
    width: 80%;}
.gwIconListL li a:link,.gwIconListL li a:visited {color:#5A5C57;text-decoration:none;}
.gwIconListL li a:hover,.gwIconListL li a:active {color:#5A5C57;text-decoration:none;}

h4.google_workspace {
    display: block;
	text-align:left;
	font-weight:bold;
    color: #cb4539 !important;
	font-size:4vw;
    line-height: 1.4em;
	padding:25px 0 0 0;
	margin:0;}
h4.google_workspace2 {
    display: block;
	text-align:left;
	font-weight:bold;
    color: #606368 !important;
	font-size:4vw;
    line-height: 1.4em;
	padding:25px 0 0 0;
	margin:0;}
h4.google_workspace3 {
    display: block;
	text-align:center;
	font-weight:bold;
    color: #07913b !important;
	font-size:4vw;
	padding:50px 0 0 0;
	margin:0;}
h5 {
    display: block;
	text-align:left;
	font-weight:bold;
	font-size:3.8vw;
	padding:20px 0 0 0;
	margin:0;}

h5.jiima {
    display: block;
	text-align:left;
	font-weight:bold;
	font-size:3.8vw;
	padding:5px 0 0 0;
margin:0;}

.scroll {
  overflow-x: scroll;
  margin-bottom: 10px;}
.scroll::-webkit-scrollbar {
  height: 5px;}
.scroll::-webkit-scrollbar-track {
  margin: 0 2px;
  background: #ccc;
  border-radius: 5px;}
.scroll::-webkit-scrollbar-thumb {
  border-radius: 5px;
  background: #666;}

.google_workspaceTbl table,
.google_workspaceTbl2 table,
.google_workspaceTbl3 table {
	width:100%;
    display: block;
	margin:10px auto 5px auto;}
.google_workspaceTbl table tr th,
.google_workspaceTbl table tr td,
.google_workspaceTbl3 table tr th,
.google_workspaceTbl3 table tr td {
	font-size: 3.5vw;
	border:1px solid #ababab;
	padding:8px 5px;
	position:relative;
    font-weight: normal;
	vertical-align: middle;}
.google_workspaceTbl2 table tr th,
.google_workspaceTbl2 table tr td {
	font-size: 3.5vw;
    border-top: 1px #ababab solid;
    border-bottom: 1px #ababab solid;
    border-right: 1px #ababab solid;
	padding:10px 5px;
	position:relative;
    font-weight: normal;
	vertical-align: middle;}
.google_workspaceTbl table tr td span,
.google_workspaceTbl2 table tr td span {
    font-size: 2vw;}
.google_workspaceTbl table tr th,
.google_workspaceTbl2 table tr th {
    text-align: center;
    color: #FFFFFF;
    background-color: #FFFFFF;
    white-space: nowrap;}
.google_workspaceTbl2 table tr th:first-child {
    border-left: none;}
.google_workspaceTbl table tr th.bgBlue,
.google_workspaceTbl2 table tr th.bgBlue {
    background-color: #4186f4;}
.google_workspaceTbl table tr th.bgGreen,
.google_workspaceTbl2 table tr th.bgGreen {
    background-color: #34a851;}
.google_workspaceTbl3 table tr th {
    text-align: center;
    color: #FFFFFF;
    background-color: #34a851;}
.google_workspaceTbl table tr td,
.google_workspaceTbl2 table tr td {
    text-align: center;
    background-color: #FFFFFF;}
.google_workspaceTbl3 table tr td {
    text-align: center;
    background-color: #FFFFFF;}
.google_workspaceTbl3 table tr th.nowrap,
.google_workspaceTbl3 table tr td.nowrap {
    white-space: nowrap;}
.google_workspaceTbl table tr td:first-child,
.google_workspaceTbl3 table tr td:first-child {
    text-align: left;}
.google_workspaceTbl2 table tr th:first-child,
.google_workspaceTbl2 table tr td:first-child {
    width: 30px;
    min-width:30px;
    padding:10px 2px; 
    text-align: left;
    border-left: none;
    border-right: none;
    vertical-align: top;}
.google_workspaceTbl2 table tr td img {
    width: 100%;}
.google_workspaceTbl2 table tr td:nth-child(2) {
    text-align: left;}
.google_workspacePriceB {
    color: #4186f4;
    font-weight: bold;
    font-size: 5vw !important;}
.google_workspacePriceG {
    color: #34a851;
    font-weight: bold;
    font-size: 5vw !important;}
.google_workspaceTbl3 a:link,.google_workspaceTbl3 a:visited {color:#34a851;text-decoration:underline;}
.google_workspaceTbl3 a:hover,.google_workspaceTbl3 a:active {color:#34a851;text-decoration:none;}

.google_workspacePrice_check {
    position: relative;
    padding-left: 15px;}
.google_workspacePrice_check:before {
    content: "";
    position: absolute;
    top: -2px;
    left: 0;
    -webkit-transform: rotate(50deg);
    -ms-transform: rotate(50deg);
    transform: rotate(50deg);
    width: 10px;
    height: 20px;
    border-right: 3px solid #ababab;
    border-bottom: 3px solid #ababab;}

.google_workspacePriceImgC {
    margin: 10px auto 20px auto;
    text-align: center;
    width: 30%;}
.google_workspacePriceImgC img {
    width: 100%;}

.google_workspacePriceTxtBic {
    text-align: center;
    margin: 0 auto;
    font-weight: bold;
    font-size: 15vw;}
.google_workspacePriceTxtBic span {
    font-size: 6vw;
    display: inline-block;
    padding-left: 0.2em;}

.google_workspacePriceBtn {
    width: 100%;
    background-color: #07913b;
    border-radius: 30px;
    color: #FFFFFF;
    text-align: center;
    font-weight: bold;
    font-size: 3.5vw;
    line-height: 3em;
    padding: 0;
    margin: 10px auto 0 auto;}
.google_workspacePriceBtn a {display: block;}
.google_workspacePriceBtn a:link,.google_workspacePriceBtn a:visited {color:#ffffff;text-decoration:none;}
.google_workspacePriceBtn a:hover,.google_workspacePriceBtn a:active {color:#ffffff;text-decoration:none;}

.corporatebox {
	display:flex; 
	flex-wrap: wrap;
	width: 100%;
	height:auto;
	padding:0px;
	margin: 6% 0 5% 0;}
.partnerImg { width: 30%; text-align: left; padding:0; margin: 0 3% 0 0;}
.partnerTxt { width: 67%; text-align: left; padding:0; margin: 0 0 5% 0;}

.cloud_telC {
    text-align: left;
    margin: 0;
    font-size: 4.8vw;
    font-weight: bold;}
.cloud_telBox {
	display:flex; 
	flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
	width: 100%;
	padding:0px;
	margin: 3% 0 0 0;}
.cloud_telTxt {
    width: 100%;
    background-color: #FFF5AC;
    padding: 20px 15px;
    margin: 0 0 3% 0;}
.cloud_telImg {
    width: 100%;}

.triangle {
    margin: 2% auto;
    overflow: hidden;
    position: relative;
    width: 220px;
    height: 40px;}
.triangle::after {
    content: "";
    position: absolute;
    width: 150px;
    height: 150px;
    background: linear-gradient(135deg, #ffe8c3, #ffe8c3, #ffa922);
    top: -86px;
    left: 35px;
    transform: scaleY(.4)
               rotate(45deg);}

.cloud_tel_conceptBox {
	display:flex; 
	flex-wrap: wrap;
    justify-content: space-between;
    align-items: flex-start;
	width: 100%;
    border-bottom: 1px #C1C1C1 solid;
    padding-bottom: 20px;
    margin-bottom: 20px;}
.cloud_tel_conceptTxt {
    order: 2;
    width: 100%;
    padding: 0px;}
.cloud_tel_conceptImg {
    order: 1;
    width: 100%;
    margin: 0 auto 3% auto;
    text-align: center;}
.cloud_tel_conceptTxt2 {
    order: 2;
    width: 100%;
    padding: 0px;}
.cloud_tel_conceptImg2 {
    order: 1;
    width: 100%;
    margin: 0 auto 3% auto;
    text-align: center;}
.cloud_tel_conceptTxt3 {
    width: 100%;
    padding: 0px;}
.capL {
    font-size: 3vw;
    text-align: center;
    margin: 3px 0px;
    line-height: 1.3em;}

.cloud_tel_introduction {
	margin: 0px;
	width: 100%;
	border-right:1px #D0D0D0  solid;}
.cloud_tel_introduction tr {
	background-color:#FFFFFF;}
.cloud_tel_introduction tr:nth-child(odd) {
	background-color:#F1F1F1;}
.cloud_tel_introduction th {
	background-color:#686868;
	background-color: #5f5957;
	border-bottom:1px #D0D0D0  solid;
	border-left:1px #D0D0D0  solid;
	color: #fff;
	font-size: 100%;
	font-weight: normal;
	vertical-align: middle;
	text-align:center;
	padding:10px;}
.cloud_tel_introduction td {
	border-bottom:1px #D0D0D0  solid;
	border-left:1px #D0D0D0  solid;
	padding: 10px;
	vertical-align: top;
	text-align:left;}

/*-------------------------------------------------
	++ addon_price
-------------------------------------------------*/
.table_price table {
	border-top: 1px solid #cbcbcb;
	border-right: 1px solid #cbcbcb;
	width: 100%;
	border-spacing: 0px;
	margin: 0 auto 10px auto;}
.table_price th {
	border-bottom: 1px solid #cbcbcb;
	border-left: 1px solid #cbcbcb;
	padding: 10px 5px;
    color: #fff;
    font-size: 3vw;
    text-align: center;
    font-weight: bold;
    background-color: #0095e5;}
.table_price td {
	border-bottom: 1px solid #cbcbcb;
	border-left: 1px solid #cbcbcb;
	text-align: center;
    background-color: #FFFFFF;
    font-size: 3vw;
	padding: 10px 5px;
    font-weight: bold;}





















