@charset "UTF-8";

body {
  color: #435561;
  font-size: 0.9rem;
  font-family: 'Fira Sans', 'a-otf-gothic-bbb-pr6n', sans-serif;
  font-weight: 400;
  font-style: normal;
  letter-spacing: 0.01em
}

h1 {
  font-size: 1.1rem;
  font-weight: bold;
  letter-spacing: 0.01em
}

h2 {
  clear: both;
  font-size: 1.1rem;
  font-weight: 500;
  padding-top: 1.5rem;
  letter-spacing: 0.01em
}

h3 {
  font-size: 0.9rem;
  font-weight: bold;
  color: #637D8F;
  margin: 2px;
  letter-spacing: 0.01em
}

a{
  color: #0B8C92;
  text-decoration: none;
}
a:hover{
  color: #0B8C92;
  opacity: 0.55;
  text-decoration: underline;
}
a.anchor{
    display: block;
    padding-top: 5.5rem;
    margin-top: -5.5rem;
}

.sidebar__name{
  font-size: 1.4rem;
  font-weight: 500;
  padding-bottom: 1.5rem;
  padding-top: 5.5rem;
  margin-right: 1.2rem;
}
.sidebar__contents{
  margin-top: 1.3rem;
  font-size: 0.9rem;
}
.sidebar__projects{
  margin-top: 1.6rem;
  margin-bottom: 1.6rem;
  font-size: 0.9rem;
}
.sidebar__project{
  margin-top: 1.0rem;
  font-size: 0.9rem;
  padding-left: 1.2rem;
}
.sidebar__icons{
  margin-top: 2.0rem;
}
.sidebar__icon{
  padding-right: 1.0rem;
}
.sidebar__icon img:hover{
  opacity: 0.75;
}

.hamburger_my_name{
  font-size: 1.4rem;
  font-weight: 500;
}

.list{
  padding-left: 1.2rem;
  padding-bottom: 0.8rem;
}

.project_authors{
  color: #FFFFFF;
  padding-right: 2rem;
  text-shadow: 1px 1px 6px #000000;
}
.project_title{
  color: #FFFFFF;
  font-size: 1.7rem;
  font-weight: 500;
  border-bottom: solid 2px #D1D1D1;
  padding-bottom: 0.5rem;
  margin-bottom: 0.7rem;
  text-shadow: 1px 1px 6px #000000;
}
.project_hero{
  background-color: #435561;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
  border-radius: .35rem;
}
.project_hero_content{
  padding: 1.5rem 2rem 1rem;
}
.project_index{
  clear: both;
  font-size: 1.3rem;
  font-weight: 500;
  margin-top: 2.5rem;
  margin-bottom: 2.5rem;
  text-align:center;
  margin-right: auto;
  margin-left: auto;
}

.video_type{
  clear: both;
  font-size: 1.3rem;
  font-weight: 500;
  padding-top: 2.5rem;
  margin-bottom: 1rem;
  text-align:center;
  margin-right: auto;
  margin-left: auto;
}

.video{
  position:relative;
  width:100%;
  padding-top:56.25%;
}
.video iframe{
  position:absolute;
  top:0;
  right:0;
  width:100%;
  height:100%;
}

.author{
  clear: both;
  font-size: 1.0rem;
  font-weight: 500;
  padding-bottom: 0.3rem;
  text-align:center;
  margin-right: auto;
  margin-left: auto;
}
.affiliation{
  clear: both;
  font-size: 0.8rem;
  font-weight: 400;
  text-align:center;
  margin-right: auto;
  margin-left: auto;
  margin-bottom: 2.2rem;
}

.label{
  display: inline-block;
  vertical-align: middle;
  margin-top: 0.5rem;
  margin-left: 0.1rem;
  margin-right: 0.3rem;
  background-image: none;
  padding: 0.1833em .533em;
  border: 1px solid;
  text-transform: none;
  font-family: 'Fira Sans', 'a-otf-gothic-bbb-pr6n', sans-serif;
  font-weight: 500;
  font-size: 0.7rem;
  border-radius: .26666667rem;
}
.label.linked:hover{
  text-decoration: underline;
  opacity: 0.55;
}
.label.conf{
  border-color: #4267B2;
  color: #4267B2;
}
.label.link{
  border-color: #0B8C92;
  color: #0B8C92;
}
.label.pdf{
  border-color: #637D8F;
  color: #637D8F;
}
.label.award{
  border-color: #B83232;
  color: #B83232;
}
.label.bibtex{
  border-color: #435561;
  color: #435561;
}
.label.slide{
  border-color: #175888;
  color: #175888;
}
.label.project{
  padding: 0.2033em 0.733em;
  font-size: 0.7rem;
  border: 1px solid #4267B2;
  background-color: #FFFFFF;
  color: #4267B2;
}
.label.blog{
  border-color: #435561;
  color: #435561;
}

.label_icon{
  display: table-cell;
  vertical-align: middle;
}
.label_contents{
  display: table-cell;
  vertical-align: middle;
  padding-left: 0.25rem;
}



.BackGround_BBeep{
  background:#ddd url(./BBeep/images/BBeep_BG.png) no-repeat center center;
  background-size:cover;
  border-radius: .35rem;
}

.BackGround_DOS{
  background:#ddd url(./DO-Scanning/images/DO-Scanning_BG.png) no-repeat center center;
  background-size:cover;
  border-radius: .35rem;
}

.BackGround_CHI20Line{
  background:#ddd url(./CHI2020_LBW_Line/image/CHI20_Line_BG.png) no-repeat center center;
  background-size:cover;
  border-radius: .35rem;
}

.BackGround_CHI20BlindPilot{
  background:#ddd url(./CHI2020_LBW_BlindPilot/image/BlindPilot_BG.png) no-repeat center center;
  background-size:cover;
  border-radius: .35rem;
}

.BackGround_IMWUT2020{
  background:#ddd url(./IMWUT2020/image/IMWUT2020_BG.png) no-repeat center center;
  background-size:cover;
  border-radius: .35rem;
}

.BackGround_CHI2021LineChaser{
  background:#ddd url(./CHI2021_LineChaser/image/CHI2021_LineChaser_BG.png) no-repeat center center;
  background-size:cover;
  border-radius: .35rem;
}

.BackGround_Acceptance{
  background:#ddd url(./AI-Suitcase-Acceptance/images/Acceptance_BG.png) no-repeat center center;
  background-size:cover;
  border-radius: .35rem;
}

.BackGround_3DMovieMap{
  background:#ddd url(./CHI2023_LBW_3DMovieMap/images/3DMovieMap_BG.png) no-repeat center center;
  background-size:cover;
  border-radius: .35rem;
}

.BackGround_MuseumTour{
  background:#ddd url(./CHI2023_MuseumTour/image/MuseumTour_BG.png) no-repeat center center;
  background-size:cover;
  border-radius: .35rem;
}

.BackGround_CCG{
  background:#ddd url(./other_papers/MobileHCI2024_ChitChatGuide/ChitChatGuide_BG.png) no-repeat center center;
  background-size:cover;
  border-radius: .35rem;
}

.BackGround_SaN{
  background:#ddd url(./other_papers/MobileHCI2024_SnapAndNav/SnapAndNav_BG.png) no-repeat center center;
  background-size:cover;
  border-radius: .35rem;
}

.BackGround_BeyondOmakase{
  background:#ddd url(./CHI2025_BeyondOmakase/image/CHI2025_BeyondOmakase-BG.png) no-repeat center center;
  background-size:cover;
  border-radius: .35rem;
}

.BackGround_AISCaseStudy{
  background:#ddd url(./other_papers/CHI2025_CaseStudy_AISuitcase/CHI2025_CaseStudy_AISuitcase_BG.png) no-repeat center center;
  background-size:cover;
  border-radius: .35rem;
}

.teaser{
  font-size: 1.1rem;
  font-weight: 400;
  width: 100%;
  padding-left: 1.2rem;
  padding-right: 1.2rem;
}
.teaser_bold{
  font-family: 'Fira Sans', sans-serif;
  font-weight: 500;
  color: #036EB8;
}
.teaser_xl{
  font-size: 1.1rem;
  font-weight: 400;
  width: 100%;
  padding-right: 1.2rem;
}

.abstract{
  font-size: 0.85rem;
  font-weight: 400;
  padding-left: 2.4rem;
  padding-right: 2.4rem;
  text-align: justify;
}
.center {
  text-align: center;
}

.project_line{
  border-top: solid 1px #435561;
  margin-top: 3.0rem;
  margin-bottom: 3.0rem;
  opacity: 0.25;
}
.related_project_line{
  border-top: solid 0.75px #637D8F;
  margin-top: 0.75rem;
  margin-bottom: 0.75rem;
  opacity: 0.25;
}

.pub_type{
  clear: both;
  font-size: 1.0rem;
  font-weight: 500;
  padding-top: 1.5rem;
  padding-bottom: 1.5rem;
}
.pub_en{
  font-size: 0.9rem;
  font-weight: 400;
  margin-top: 1.0rem;
  padding-left: 2.4rem;
  padding-right: 2.4rem;
  padding-bottom: 1.0rem;
}
.pub_js{
  font-size: 0.85rem;
  font-family: 'a-otf-gothic-bbb-pr6n', sans-serif;
  font-weight: 400;
  font-style: normal;
  padding-left: 2.4rem;
  padding-right: 2.4rem;
  padding-bottom: 1.0rem;
}

.patent{
  font-size: 0.85rem;
  padding-left: 2.4rem;
  padding-right: 2.4rem;
}

.body_en{
  font-size: 0.9rem;
  font-family: 'Fira Sans', sans-serif;
  font-weight: 400;
}
.body_en_bold{
  font-size: 0.9rem;
  font-family: 'Fira Sans', sans-serif;
  font-weight: 500;
}
.body_link{
  font-size: 0.77rem;
  font-family: 'Fira Sans', sans-serif;
  font-weight: 400;
}

.body_js{
  font-size: 0.85rem;
  font-family: 'a-otf-gothic-bbb-pr6n', sans-serif;
  font-weight: 400;
  font-style: normal;
}

.footer{
  text-align: center;
  margin-top: 4.0rem;
  margin-bottom: 1.5rem;
  opacity: 0.75;
}



.project_name{
  font-size: 1.0rem;
  font-weight: 500;
}
.project_author{
  font-size: 0.8rem;
  margin-top: 0.5rem;
}
.project_teaser{
  display: flex;
}
.project_teaser img{
  opacity: 0.9;
}
.table{
  display: table;
}
.table > div{
    display:table-cell;
    vertical-align: middle;
}
.project_teaser.tba img:hover{
  /* opacity: 0.85; */
}

.proj_label{
  display: inline-block;
  vertical-align: middle;
  margin-top: 0.5rem;
  margin-right: 0.5rem;
  background-image: none;
  padding: 0.1033em .633em;
  border: 1px solid #4267B2;
  color: #4267B2;
  text-transform: none;
  font-weight: 500;
  font-size: 0.75rem;
  border-radius: .26666667rem;
}

.caption{
  clear: both;
  font-size: 0.95rem;
  margin-top: 0.5rem;
  text-align:center;
  margin-right: auto;
  margin-left: auto;
}

.comments{
  font-style: italic;
  padding-bottom: 0.5rem;
}

.participants{
  text-align: right;
  font-size: 0.85rem;
  padding-bottom: 1.5rem;
}